/*
Theme Name:		parsa
Theme URI:		http://www.welcart.com/
Author:			Collne Inc.
Author URI:		http://www.collne.com/
Description:	Welcart Basic is the Welcart dedicated theme.
Version:		1.2.7
License:		GNU General Public License v2 or later
License URI:	http://www.gnu.org/licenses/gpl-2.0.html
Tags:			responsive-layout, white, right-sidebar
color: #5E7437;
color: rgba(255, 255, 255, 0.7);
background-color: #E9E4DD;
color: rgba(233, 228, 221, 0.7);
*/


/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.menu-header-container {
	margin: 0;
      padding: 0;
	
}
.main-navigation a{
  font-family: 'Raleway', sans-serif;
 color: rgba(255, 255, 255, 0.7);}

  .main-navigation > div {
    display: inline-block; }
    .main-navigation > div ul {
      display: none;
      list-style: none;
      margin: 0;
      padding: 0; }
      .main-navigation > div ul ul /*プルダウン*/{
        background: rgba(255, 255, 255, 0.8);
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
        float: left;
        opacity: 0;
        padding: 0;
        position: absolute;
        text-align: left;
        top: 80px; /*不要？*/
        -webkit-transition: all 0.1s ease-in-out;
        -moz-transition: all 0.1s ease-in-out;
        transition: all 0.1s ease-in-out;
        -webkit-transform-origin: center top;
        -moz-transform-origin: center top;
        -ms-transform-origin: center top;
        -o-transform-origin: center top;
        transform-origin: center top;
        -webkit-transform: scaleY(0);
        -moz-transform: scaleY(0);
        -ms-transform: scaleY(0);
        -o-transform: scaleY(0);
        transform: scaleY(0);
        visibility: hidden;
        z-index: 99999; }
        .main-navigation > div ul ul ul {
          left: 100%;
}
        .main-navigation > div ul ul li {
          padding: 0; }
          .main-navigation > div ul ul li:hover > ul,
          .main-navigation > div ul ul li.focus > ul {
            left: 100%; }
          .main-navigation > div ul ul li:last-child a {
            border-bottom: 0; }
        .main-navigation > div ul ul a {
			border-bottom: 1px solid #333333;
			font-size: 13.8656px;
			font-size: 0.8666rem;
			letter-spacing: normal;
			line-height: normal;
			margin: 0 20px;
			padding: 15px 0;
			min-width: 150px;
			text-transform: none;
			color: rgba(51, 51, 51, 1);
			/*プルダウンのリンク色*/
}.main-navigation > div ul ul a:hover {
			color: rgba(51, 51, 51, 0.5);
			/*プルダウンのリンク色*/
}
      .main-navigation > div ul li:hover > ul,
      .main-navigation > div ul li.focus > ul {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -moz-transform: scaleY(1);
        -ms-transform: scaleY(1);
        -o-transform: scaleY(1);
        transform: scaleY(1);
        visibility: visible; }
    .main-navigation > div li {
      float: left;
      padding: 0 16px 0 0;
      position: relative; }
      .main-navigation > div li:last-child {
        padding-right: 0; }
      .main-navigation > div li a {
        text-transform: uppercase;
        color: #5E7437;
        font-size: 12.8px;
        font-size: 0.8rem;  
        letter-spacing: 1px;
        line-height: 80px;
        margin: 0;
        padding:0;
		color: rgba(255, 255, 255, 1);
		/*メニューのリンク色*/
}
      .main-navigation > div li:hover > a,
      .main-navigation > div li.focus > a {
        color: rgba(255, 255, 255, 0.7);
		  /*メニューのHoverリンク色*/
}
    .main-navigation > div a {
      display: block;
      text-decoration: none; }
  .main-navigation .mega-menu .mega-menu-megamenu ul.mega-sub-menu {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1); }



.main-navigation {
	float: left; 
	height: 60px
}
 @media (min-width: 768px) {
	.main-navigation {
	height: 80px
}
}
/*--------------------------------------------------------------
## Social and Search Icons
--------------------------------------------------------------*/
.social-search {
	float: right;
	padding: 0; 
	}
  .social-search .search-toggle {
    background: transparent;
    border: none;
    outline: none;
    padding: 0; }
    .social-search .search-toggle .open {
      display: block; }
    .social-search .search-toggle .close {
      display: none; }
     
    .social-search .search-toggle.close-search .open {
      display: none; }
    .social-search .search-toggle.close-search .close {
      display: block; }

  .social-search .search-toggle i {
    color: rgba(255, 255, 255,1);
	  font-size: 1.3rem;
	  line-height: 60px;
	  padding: 0 0.5rem;
	  width: 32px;
}

  .social-search .widget {
    display: inline-block;
}

  .social-search .widget a{
    padding: 0 0.5rem;
}
  .social-search .widget a i{
	color: rgba(255, 255, 255,1);
	  font-size: 1.3rem;
	  line-height: 60px;
}
 @media (min-width: 768px) {
	  .social-search .widget a i,.social-search .search-toggle i {
	  line-height: 80px;
}
}

.social-search .widget a:hover i{
	color: rgba(255, 255, 255,.8);
}

/*--------------------------------------------------------------
## Mobile Menu　モバイルメニュー
--------------------------------------------------------------*/
.main-navigation > div ul {
  display: none; }

.menu-toggle {
  display: block;
  border: 0;
  background: transparent;
  outline: none;
	padding: 0; 
}

 .menu-toggle i {
    vertical-align: middle;
	 color: rgba(255, 255, 255,1);
	 font-size: 1.3rem;
	  line-height: 60px;
	 padding: 0 0.5rem;
}
 @media (min-width: 768px) {
	  .menu-toggle i {
	  line-height: 80px;
}
}

#mobile-navigation {
  left: 0;
  position: absolute;
  text-align: left;
  top: 60px;
  width: 100%;
  z-index: 10; }

  #mobile-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0; }
    #mobile-navigation ul li {
		background: rgba(160,160,160,.9);
      border-bottom: 1px solid #ebebeb;
      line-height: 42px;
      padding: 0;
      position: relative;
      width: 100%; }
      #mobile-navigation ul li a {
        color: #FFF;
        display: block;
        font-size: 12.8px;
        font-size: 0.8rem;
        letter-spacing: .1em;
        line-height: normal;
        padding: 14px 0 12px 20px;
        text-transform: uppercase;
        width: 100%; }
        #mobile-navigation ul li a.has-dropdown-button:not([href]) {
          cursor: pointer;
}
      #mobile-navigation ul li.menu-item-has-children > a {
        max-width: 100%;
        padding-right: 48px; }
      #mobile-navigation ul li .dropdown-toggle {
        background: transparent;
        border: 0;
        box-shadow: none;
        content: "Open";
        height: 30px;
        padding: 6px;
        position: absolute;
        right: 5px;
        top: 6px;
        outline: none;
        width: 42px; }
        #mobile-navigation ul li .dropdown-toggle .svg-icon-submenu {
          height: 10px;
          width: 10px; }
          #mobile-navigation ul li .dropdown-toggle .svg-icon-submenu path {
            fill: #FFF; }
    #mobile-navigation ul ul {
      border-top: 1px solid #ebebeb;
      display: none;
      margin: 0;
      padding: 0; }
      #mobile-navigation ul ul li {
        background: rgba(255,255,255,.6);
        border-bottom: 1px solid #aaa;}
        #mobile-navigation ul ul li:last-of-type {
          border: 0; }
        #mobile-navigation ul ul li a {
          padding-left: 40px;
          text-transform: uppercase;
          width: 100%;
color:#999;}
        #mobile-navigation ul ul li ul {
          display: none; }

#mobile-navigation ul ul li a {
  padding-left: 40px;
color: #777;}

#mobile-navigation ul ul ul li a {
  padding-left: 80px; }

#mobile-navigation ul ul ul ul li a {
  padding-left: 120px; }

#mobile-navigation ul ul ul ul ul li a {
  padding-left: 160px; }

#mobile-navigation ul ul ul ul ul ul li a {
  padding-left: 200px; }


@media screen and (max-width: 767px) { 
	.main-navigation .menu-toggle { display: block; }
	.main-navigation { float:right; }
	.main-navigation > div, .main-navigation > div ul, .main-navigation .shopping-cart { display: none; }
	} 
@media screen and (min-width: 768px) {
	#mobile-navigation { display: none !important; } .main-navigation > div ul { display: block; }
	.main-navigation .shopping-cart { display: inline-block; }
	.main-navigation .menu-toggle { display: none; } 
	}


/*--------------------------------------------------------------
## Site Masthead
--------------------------------------------------------------*/
.animateIn{
  -webkit-transform: translateY(0px);
          transform: translateY(0px);
}

.animateOut{
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}
#masthead {
  z-index: 101;
  transition: all 300ms ease-in-out;
  position: fixed;
  width: 100%;
}

.top-bar {
	padding: 0 16px;
	width: 100%;
	text-transform: uppercase;
	justify-content: space-around;
	background: rgba(214,207,198, 1);
	transition: all 300ms ease-in-out;
	z-index: 11111;
	background-image: url(images/texture2.png);
	background-size: 250px;
	opacity: 1;
}
 .top-bar::after {
      clear: both;
      content: "";
      display: table; }


/*タイトル*/
.site-title {
	display: block;
	text-indent: -99999px;
	float:left;
	width:120px;
	margin: 8px 16px 8px 0;
       }
.site-title a {
    display:block;
	background-image: url(images/logo.svg);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: left center;
	margin: 0;
	height: 42px;
}

@media screen and (min-width : 768px) {
/* ここにPAD用のCSSを記述*/
.site-title {
	width:140px;
	margin: 16px 16px 16px 16px;
}
.site-title a{
	height: 48px;
}
}
@media screen and (min-width : 1000px) {
/* ここにPC用のCSSを記述*/
.site-title {
	width:172px;
	margin: 14px 16px 14px 16px;
}
.site-title a{
	height: 52px;
}
}



#masthead button {
	background: none;
	cursor: pointer;
	cursor: hand;
	opacity: 1;
 }
#masthead button:hover {
	opacity: 0.8;
 }

/*--------------------------------------------------------------
## Full Screen Search
--------------------------------------------------------------*/

#fullscreen-search {
  background: rgba(255, 255, 255, 0.8);
  display: none;
  left: 0;
  position: fixed;
  z-index: 10; }
  #fullscreen-search .container {
    left: 50%;
    max-width: 658px;
    position: absolute;
    top: 139px;
    transform: translate(-50%, -50%); }
  #fullscreen-search h3 {
    color: rgba(102, 102, 102, 1);
    font-size: 17.0656px;
    font-size: 1.0666rem;
    font-weight: 400;
    letter-spacing: .2em;
    text-align: center;
    text-transform: uppercase; }


#fullscreen-search form {
    position: relative; }
    #fullscreen-search form input[type="search"] {
      background: transparent;
      border: 0;
      color: rgba(102, 102, 102, 1);
      display: inline-block;
      font-size: 32px;
      max-width: 493px;
      outline: none; }

      @media (max-width: 768px) {
        #fullscreen-search form input[type="search"] {
          font-size: 20px;
          max-width: 100%;
          padding-left: 0; } }

    #fullscreen-search form button[type="submit"] {
      border: none;
      display: inline-block;
      outline: none;
      padding: 0;
      position: absolute;
      right: 0;
      top: 24px; }


      @media (max-width: 768px) {
        #fullscreen-search form button[type="submit"] {
          top: 12px;
		  height: 31px;
        padding: 3px;
        width: 32px;} }

      #fullscreen-search form button[type="submit"] i {
        fill: #666;
        height: 31px;
        padding: 3px;
        width: 32px;
		font-size: 28px;
		font-size: 1.75rem;
	  line-height: 1;}

        @media (max-width: 768px) {
          #fullscreen-search form button[type="submit"] i {
            height: 24px; } }

        @media (max-width: 480px) {
          #fullscreen-search form button[type="submit"] i {
             } }

        #fullscreen-search form button[type="submit"] i:last-child {
          display: none; }
          #fullscreen-search form button[type="submit"] i:last-child {
            -webkit-animation: spin 2s linear infinite;
            -moz-animation: spin 2s linear infinite;
            animation: spin 2s linear infinite;
            -webkit-transform-origin: 50% 50%;
            -moz-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
            -o-transform-origin: 50% 50%;
            transform-origin: 50% 50%; }

@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg); } }

@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg); }
  to {
    -moz-transform: rotate(360deg); } }

@keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg); }
  to {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg); } }