@charset "utf-8";
/* CSS Document */

h4,
h5,
h6,
p {
    margin: 0;
    padding: 0;
}

.clearfix::after {
    content: " ";
    display: block;
    clear: both;
}

.pc {
    display: block;
}

.sp {
    display: none;
}


/*----------------------
テーマリセット
----------------------*/

body {
    font-family: 'Arial', YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
}

body:before {
    width: 26.4118%;
}

.entry-content a {
    border: none;
     !important
}

.site {
    max-width: 1920px;
}

.site-main {
    padding: 0;
}

.hentry {
    margin: 0;
    padding: 0;
}

.entry-content {
    padding: 0;
}

.site-content {
    margin-left: 26.4118%;
    width: 73.5882%;
}

.entry-header {
    display: none;
}

/* 共通 */

.contaner {
    margin: 30px auto;
}

.contaner .block01,
.contaner .block02 {
    margin-bottom: 40px;
    padding: 30px 0;
}

#secondary {
    font-family: sans-serif;
    text-align: justify;
    text-justify: inter-ideograph;
    line-break: strict;
    font-size: 1.8rem;
    line-height: 1.8;
}

#secondary .widget_nav_menu {
    margin-bottom: 10%;
     !important
}



/*==========================

フォーマット

==========================*/

/*--------------------------
ナビゲーション
--------------------------*/

#secondary .widget_nav_menu {
    text-align: center;
}

.contaner h2 {
    margin: 0 auto 2em;
    text-align: center;
}

.contaner h3 {
    margin: 0 auto 0.6em;
    font-size: 140%;
}

/*--------------------------
フッター
--------------------------*/

.site-footer {
    margin: 0 0 0 26.4118%;
     !important padding: 0;
    width: 73.5998%;
    background: #000;
    color: #fff;
}

.company-info {
    padding: 2.5%;
}

.company-info .info {
    font-size: 70%;
    line-height: 1.2;
}

.company-info .logo,
.company-info .info {
    float: left;
}

.company-info .logo {
    margin-right: 10px;
}

.company-info span {
    display: block;
}

.site-info {
    width: 100%;
    padding: 0;
    text-align: center;
    color: #cdcdcd;
    font-size: 80%;
}



/*==========================

ページ固定

==========================*/

/*--------------------------
TOP
--------------------------*/

.mv,
.mv img {
    width: 100%;
}
.mv ul {
	margin:0;
}

.contaner .block01 {
    text-align: center;
}

.contaner .block01,
.contaner .block03 {
    width: 80%;
    margin: 0 auto 60px;
}

.contaner .block02 {
    padding-top: 8%;
}

/* block02 */

.contaner .wrap#block02 {
    background: #decdc8;
}

.contaner .block02 {
    width: 100%;
    background: #f3f0ee;
}

.contaner .block02 h2 {
    text-align: center;
}

.contaner .block02 h4 {
    font-size: 110%;
}

.contaner .block02 .wrap {
    width: 80%;
    margin: 0 auto;
}

.contaner .block02 .wrap.l2 {
    margin-top: 60px;
}

.contaner .block02 .wrap .L {
    float: left;
}

.contaner .block02 .wrap .R {
    float: right;
}

.contaner .block02 .wrap .L,
.contaner .block02 .wrap .R {
    width: 48%;
}

.contaner .block02 .wrap .L .photo,
.contaner .block02 .wrap .R .photo {
    width: 100%;
}

.contaner .block02 .wrap.l2 .spec {
    margin-top: 5%;
}

.contaner .block02 .wrap .spec h4 {
    border-left: 5px solid #f08200;
    padding-left: 3%;
    padding-bottom: 3%;
}

.contaner .block02 .wrap .spec h4 img {
    max-width: 100%;
    height: 60px;
}

.contaner .block02 .wrap .spec .price {
    font-size: 140%;
    font-weight: bold;
}

.contaner .block02 .wrap .spec .price span {
    font-size: 60%;
}

.contaner .block02 .wrap .spec .price .price {
    font-size: 160%;
    color: #c41d1d;
}


.contaner .block02 .wrap .spec .cap {
    margin-top: 5%;
    font-size: 100%;
}

.contaner .btn {
    width: 35%;
    margin: 5% auto;
    padding: 2% 0;
    background: #231815;
    text-align: center;
}

.contaner .btn a {
    color: #fff;
    font-weight: 600;
    font-size: 140%;
    text-decoration: none;
}

.contaner .btn:hover {
    background: #48403e;
}

/* banner */

.contaner .banner {
    width: 90%;
    margin: 0 auto 15%;
}

.contaner .banner .bnr01 {
    width: 40%;
    margin: 0 auto;
}

.contaner .banner .bnr01 img {
    width: 100%;
}

.contaner .instagram {
    width: 40%;
}

/*--------------------------
製品紹介
--------------------------*/

/*********************
 製品紹介
*********************/

/* 共通 */

#seihin.contaner {
    margin-top: 0;
    padding-top: 5%;
}

#seihin.contaner .block00 {
    width: 80%;
    margin: 4% auto 0;
    padding-bottom: 40px;
    text-align: center;
}

#seihin.contaner .wrap h4 {
    border-left: 5px solid #f08200;
    padding-left: 3%;
    padding-bottom: 3%;
}

#seihin.contaner .wrap h4 img {
    max-width: 100%;
    height: 60px;
}

#seihin.contaner .wrap .cap {
    margin-top: 5%;
    font-weight: 600;
}

#seihin.contaner .wrap .scap {
    font-size: 80%;
}

#seihin.contaner .wrap .price {
    font-size: 140%;
    font-weight: bold;
}

#seihin.contaner .wrap .price span {
    font-size: 60%;
}

#seihin.contaner .wrap .price .price {
    font-size: 160%;
    color: #c41d1d;
}

#seihin.contaner .wrap .option {
    margin-top: 3%;
    font-size: 80%;
    line-height: 1.4;
}


/* block01 */

#seihin.contaner .block01 {
    width: 80%;
    margin: 4% auto 0;
    padding-bottom: 40px;
    text-align: left;
}

#seihin.contaner .block01 .wrap {
    width: 100%;
    margin: 0 auto;
}

#seihin.contaner .block01 .wrap.mt5 {
    margin-top: 5%;
}

#seihin.contaner .block01 .wrap .R {
    float: right;
    width: 48%;
}

#seihin.contaner .block01 .wrap .L {
    float: left;
    width: 48%;
}

#seihin.contaner .block01 .photo,
#seihin.contaner .block02 .photo {
    display: flex;
    justify-content: space-between;
    margin-top: 3%;
}

#seihin.contaner .block01 .photo .list,
#seihin.contaner .block02 .photo .list {
    width: 18.5%;
}

#seihin.contaner .block01 .photo .list img,
#seihin.contaner .block02 .photo .list img {
    width: 100%;
}



/* block02 */

#seihin.contaner .block02 {
    width: 80%;
    margin: 3% auto 0;
    padding: 0;
    background: none;
}

#seihin.contaner .block02 .wrap {
    width: 100%;
    padding: 0;
}


/* airyaku */

.gairyaku {
    width: 80%;
    margin: 5% auto 0;
}


/* block03 */

#seihin.contaner .block03 {
    width: 100%;
    margin: 5% auto 0;
    padding: 5% 10%;
    text-align: left;
    background: #f3f0ee;
}

#seihin.contaner .block03 .wrap {
    width: 100%;
    margin: 0 auto;
}

#seihin.contaner .block03 .wrap.mt5 {
    margin-top: 5%;
}

#seihin.contaner .block03 .wrap .R {
    float: right;
    width: 52%;
}

#seihin.contaner .block03 .wrap .L {
    float: left;
    width: 44.8%;
}

#seihin.contaner .block03 .wrap .wrap_set {
    margin-top: 2%;
    font-size: 90%;
    line-height: 2.0em;
}

#seihin.contaner .block03 .wrap .wrap_set .L {
    width: 50%;
}

#seihin.contaner .block03 .wrap_set .L ul li {
    padding-left: 1em;
    text-indent: -1em;
    list-style: none;
}

#seihin.contaner .block03 .wrap .wrap_set .L.last {
    border-left: none;
    padding: 0;
}


/* block04 */

#seihin.contaner .block04 {
    width: 80%;
    margin: 5% auto 0;
}

#seihin.contaner .block04 .wrap.wd4 {
    border: 1px solid #221715;
    padding: 3%;
}

#seihin.contaner .block04 .wrap .L {
    float: left;
    width: 44.8%;
}

#seihin.contaner .block04 .wrap .L h5 {
    border-left: 5px solid #000;
    padding-left: 3%;
}

#seihin.contaner .block04 .wrap .L .cap {
    font-size: 80%;
    margin-top: 2%;
}

#seihin.contaner .block04 .wrap .R {
    float: right;
    width: 52%;
}

#seihin.contaner .block04 .wrap.wd4 .R img {
    width: 100%;
}


/* tel box */

.tel_box {
    width: 80%;
    margin: 8% auto 5%;
}

.tel_box img {
    width: 100%;
}




/*--------------------------
レスポンシブ
--------------------------*/

@media screen and ( max-width:640px) {
    /* リセット */
    .site-content,
    .site-footer {
        margin: 0;
        width: 100%;
    }
    .site-header {
        padding: 3%;
      position: relative;
    }
    .custom-logo {
        max-height: 50px;
    }


    /* 共通 */
    .contaner {
        margin: 0 auto;
    }
    .contaner h3 {
        font-size: 125%;
    }
    .contaner .block01,
    .contaner .block03 {
        width: 90%;
        margin-bottom: 40px;
        padding: 2% 0;
    }
    .contaner .block01 h2 img,
    .contaner .block02 h2 img {
        width: 80%;
    }
    .contaner .block02 {
        width: 100%;
        margin-bottom: 40px;
        padding: 10% 5%;
    }
    .contaner .block02 .wrap {
        width: 100%;
    }
    .company-info .logo {
        width: 16%;
    }
    .pc {
        display: none;
    }
    .sp {
        display: block;
    }

    /* block01 */
    .contaner .block01 {
        width: 90%;
        margin: 5% auto;
    }

    /* block02 */
    #seihin.contaner .block02 {
        width: 90%;
        margin: 0 auto;
    }
    /* TOP */
    #top.contaner .block01,
    #top.contaner .block02 {
        margin-top: 8%;
    }
    .contaner .block02 .wrap.l2 {
        margin-top: 0;
    }
    .contaner .btn {
        width: 80%;
        padding: 4% 0;
    }
    .contaner .btn a {
        font-size: 120%;
    }
    .contaner .banner .bnr01 {
        width: 100%;
    }
    .contaner .instagram {
        width: 70%;
    }


    /*********************
    製品紹介
    *********************/
    /* 共通 */
    #seihin.contaner .block01,
    #seihin.contaner .block02,
    #seihin.contaner .block03,
    #seihin.contaner .block04 {
        width: 90%;
        margin: 0 auto;
    }
    #seihin.contaner .block02,
    #seihin.contaner .block03,
    #seihin.contaner .block04,
    #seihin.contaner .block05 {
        width: 90%;
        margin: 5% auto;
    }
    #seihin.contaner .block03 {
        width: 100%;
        margin: 15% 0 0;
        padding: 15% 5% 5%;
    }
    .contaner .block02 .wrap .L,
    .contaner .block02 .wrap .R,
    #seihin.contaner .block01 .wrap .L,
    #seihin.contaner .block01 .wrap .R,
    #seihin.contaner .block02 .wrap .L,
    #seihin.contaner .block02 .wrap .R,
    #seihin.contaner .block03 .wrap .L,
    #seihin.contaner .block03 .wrap .R,
    #seihin.contaner .block04 .wrap .L,
    #seihin.contaner .block04 .wrap .R {
        float: none;
        width: 100%;
        margin-bottom: 30px;
    }
    #seihin.contaner .block04 .wrap .R {
        margin-bottom: 0;
    }
    #seihin.contaner .wrap .price {
        font-size: 115%;
    }
    #seihin.contaner .block01 .wrap.mt5 {
        margin-top: 15%;
    }
    #seihin.contaner .gairyaku {
        width: 90%;
    }
    #seihin.contaner .block03 .wrap_set .L {
        width: 48%;
        margin-bottom: 0;
        float: left !important;
    }
    #seihin.contaner .block04 .wrap.wd4 {
        margin: 15% auto;
        padding: 8%;
    }
    #seihin.contaner .block04 .wrap.wd4 .R img {
        width: 100%;
    }
    #seihin.contaner {
        padding-bottom: 20px;
    }
    .contaner .btn.tel {
        width: 90%;
        margin: 40px auto 40px;
        padding: 20px 0;
        background: #f80000;
        text-align: center;
    }
    .tel_box {
        width: 100%;
        margin: 30px auto;
    }

    .tel_box .sp {
        width: 100%;
        position: relative;
    }
    .tel_box .sp .btn_wrap {
        width: 90%;
        position: absolute;
        top: 70%;
        left: 5%;
    }
    .tel_box .sp a.tel,
    .tel_box .sp a.mail {
        display: block;
        width: 48%;
    }
    .tel_box .sp a.tel {
        float: left;
    }
    .tel_box .sp a.mail {
        float: right;
    }
    .site-footer .site-info p {
        margin-bottom: 0;
    }
    .block03 .instagram {
        width: 70%;
    }

}


    body:before,
    .site-header {
      background-color: #231815;
    }

    @media screen and (min-width: 59.6875em) {
      .site-header,
      .secondary {
        background-color: transparent;
      }

      .widget button,
      .widget input[type="button"],
      .widget input[type="reset"],
      .widget input[type="submit"],
      .widget_calendar tbody a,
      .widget_calendar tbody a:hover,
      .widget_calendar tbody a:focus {
        color: #231815;
      }
    }


    /* Custom Sidebar Text Color */

    .site-title a,
    .site-description,
    .secondary-toggle:before {
      color: #ffffff;
    }

    .site-title a:hover,
    .site-title a:focus {
      color: #ffffff;
      /* Fallback for IE7 and IE8 */
      color: rgba( 255, 255, 255, 0.7);
    }

    .secondary-toggle {
      border-color: #ffffff;
      /* Fallback for IE7 and IE8 */
      border-color: rgba( 255, 255, 255, 0.1);
    }

    .secondary-toggle:hover,
    .secondary-toggle:focus {
      border-color: #ffffff;
      /* Fallback for IE7 and IE8 */
      border-color: rgba( 255, 255, 255, 0.3);
    }

    .site-title a {
      outline-color: #ffffff;
      /* Fallback for IE7 and IE8 */
      outline-color: rgba( 255, 255, 255, 0.3);
    }

    @media screen and (min-width: 59.6875em) {
      .secondary a,
      .dropdown-toggle:after,
      .widget-title,
      .widget blockquote cite,
      .widget blockquote small {
        color: #ffffff;
      }

      .widget button,
      .widget input[type="button"],
      .widget input[type="reset"],
      .widget input[type="submit"],
      .widget_calendar tbody a {
        background-color: #ffffff;
      }

      .textwidget a {
        border-color: #ffffff;
      }

      .secondary a:hover,
      .secondary a:focus,
      .main-navigation .menu-item-description,
      .widget,
      .widget blockquote,
      .widget .wp-caption-text,
      .widget .gallery-caption {
        color: rgba( 255, 255, 255, 0.7);
      }

      .widget button:hover,
      .widget button:focus,
      .widget input[type="button"]:hover,
      .widget input[type="button"]:focus,
      .widget input[type="reset"]:hover,
      .widget input[type="reset"]:focus,
      .widget input[type="submit"]:hover,
      .widget input[type="submit"]:focus,
      .widget_calendar tbody a:hover,
      .widget_calendar tbody a:focus {
        background-color: rgba( 255, 255, 255, 0.7);
      }

      .widget blockquote {
        border-color: rgba( 255, 255, 255, 0.7);
      }

      .main-navigation ul,
      .main-navigation li,
      .secondary-toggle,
      .widget input,
      .widget textarea,
      .widget table,
      .widget th,
      .widget td,
      .widget pre,
      .widget li,
      .widget_categories .children,
      .widget_nav_menu .sub-menu,
      .widget_pages .children,
      .widget abbr[title] {
        border-color: rgba( 255, 255, 255, 0.1);
      }

      .dropdown-toggle:hover,
      .dropdown-toggle:focus,
      .widget hr {
        background-color: rgba( 255, 255, 255, 0.1);
      }

      .widget input:focus,
      .widget textarea:focus {
        border-color: rgba( 255, 255, 255, 0.3);
      }

      .sidebar a:focus,
      .dropdown-toggle:focus {
        outline-color: rgba( 255, 255, 255, 0.3);
      }
    }


    .site-header {
      padding-top: 14px;
      padding-bottom: 14px;
    }

    .site-branding {
      min-height: 42px;
    }

    @media screen and (min-width: 46.25em) {
      .site-header {
        padding-top: 21px;
        padding-bottom: 21px;
      }
      .site-branding {
        min-height: 56px;
      }
    }

    @media screen and (min-width: 55em) {
      .site-header {
        padding-top: 25px;
        padding-bottom: 25px;
      }
      .site-branding {
        min-height: 62px;
      }
    }

    @media screen and (min-width: 59.6875em) {
      .site-header {
        padding-top: 0;
        padding-bottom: 0;
      }
      .site-branding {
        min-height: 0;
      }
    }

    .site-title,
    .site-description {
      clip: rect(1px, 1px, 1px, 1px);
      position: absolute;
    }


    /*
ここに独自の CSS を追加することができます。

詳しくは上のヘルプアイコンをクリックしてください。
*/

    /*----------------------
テーマリセット
----------------------*/

    body:before {
      width: 26.4118%;
    }

    .entry-content a {
      border: none;
       !important
    }

    .site {
      max-width: 1920px;
    }

    .site-main {
      padding: 0;
    }

    .hentry {
      margin: 0;
      padding: 0;
    }

    .entry-content {
      padding: 0;
    }

    .site-content {
      margin-left: 26.4118%;
      width: 73.5882%;
    }

    .entry-header {
      display: none;
    }

    #secondary {
      font-family: sans-serif;
      text-align: justify;
      text-justify: inter-ideograph;
      line-break: strict;
      font-size: 1.8rem;
      line-height: 1.8;
    }

    #secondary .widget_nav_menu {
      margin-bottom: 10%;
       !important
    }



    /*==========================

フォーマット

==========================*/

    /*--------------------------
フッター
--------------------------*/

    .site-footer {
      margin: 0 0 0 26.4118%;
       !important padding: 0;
      width: 73.5998%;
      background: #000;
      color: #fff;
    }

    .company-info {
      padding: 2.5%;
    }

    .company-info .info {
      font-size: 70%;
      line-height: 1.2;
    }

    .company-info .logo,
    .company-info .info {
      float: left;
    }

    .company-info .logo {
      margin-right: 10px;
      width: 46px;
    }

    .company-info span {
      display: block;
    }

    .site-info {
      width: 100%;
      padding: 0;
      text-align: center;
      color: #cdcdcd;
      font-size: 80%;
    }


    @media screen and ( max-width:640px) {
      /* リセット */
      .site-content,
      .site-footer {
        margin: 0;
        width: 100%;
      }
      .site-header {
        padding: 3%;
      }
      .custom-logo {
        max-height: 50px;
      }
    }

/*PCのスタイル*/
header nav {
	display: none;    
}
header nav ul{
	display: flex;
	align-items: center;
	
}
header nav ul li a{
	color: #fff;
	text-decoration: none;
	font-weight: bold;
	padding: 16px ;
}
#nav_toggle{
	display: none;
}

@media screen and (max-width:960px){
	nav{
		display: none;
		position: absolute;
		top:72px;
		width: 100%;
		background: rgba(0,0,0,0.6);
		left: 0;
      z-index: 999;
	}
	header nav ul{
		display: block;
		margin: 0 auto;
		width: 90%;
	}
	header nav ul li{
		margin: 0 auto;
		text-align: center;
		border-bottom: 1px solid #c1c1c1;
        text-decoration: none;
	}
	header nav ul li:last-child{
		border: none;
	}
	header nav ul li a{
		display: block; 
	}
  header nav ul li a:hover{
		color:#fff;
	}
 
}

@media screen and (max-width:960px){	
	/*開閉ボタン*/
	#nav_toggle{
		display: block;
		width: 40px;
		height: 40px;
		position: absolute;
		top: 30%;
      right: 10px;
		z-index: 100;
	}
	#nav_toggle div {
		position: relative;
	}
	#nav_toggle span{
		display: block;
		height: 3px;
		background: #fff;
		position:absolute;
		width: 100%;
		left: 0;
		-webkit-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		transition: 0.5s ease-in-out;	
	}
	#nav_toggle span:nth-child(1){
		top:0px;
	}
	#nav_toggle span:nth-child(2){
		top:12px;
	}
	#nav_toggle span:nth-child(3){
		top:24px;
	}
	
	/*開閉ボタンopen時*/
	.open #nav_toggle span:nth-child(1) {
			top: 12px;
		   -webkit-transform: rotate(135deg);
			-moz-transform: rotate(135deg);
			transform: rotate(135deg);
		}
		.open #nav_toggle span:nth-child(2) {
			width: 0;
			left: 50%;
		}
		.open #nav_toggle span:nth-child(3) {
			top: 12px;
			-webkit-transform: rotate(-135deg);
			-moz-transform: rotate(-135deg);
			transform: rotate(-135deg);
		}
}

#instafeed{
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.col-sm-3.col-xs-6.insta-box{
  width:33%;
  margin:0 0.5% 0.5% 0;
}
.col-sm-3.col-xs-6.insta-box:nth-child(3n){
  margin-right:0;
}
#btn-more{
    width: 35%;
    margin: 5% auto;
    padding: 2% 0;
    background: #231815;
    text-align: center;
  display: block;
    color: #fff;
    font-weight: 400;
    font-size: 100%;
    text-decoration: none;
}

@media screen and (max-width: 640px){
#btn-more {
    width: 80%;
    padding: 4% 0;
  font-size: 100%;
}
}

.annnai{
  width:100%;
  margin:0 auto 5%;
  border:1px solid #000;
  padding:4%;
}
.annnai .ttl{
  font-size: 120%;
  text-align: center;
  margin-bottom:2%;
}
.annnai .ttl span{
  display: inline;
}
.onlyPc{
  display: block;
}

@media screen and (max-width: 640px){
.onlyPc{
  display: none;
}
}