.red{color:#ff1111;}

nav.fs-c-breadcrumb{
margin: 0 0 0 20px;
}
.fs-p-messageBoard {
    background-color: #fffeef;
    border: 1px solid #dbd995;
    border-radius: 3px;
    color: #3c3c3c;
    margin-bottom: 24px;
    padding: 16px;
    text-align: center;
}
.fs-p-messageBoard2 {
    background-color: #ffeeee;
    border: 1px solid #ffb0b0;
    border-radius: 3px;
    color: #3c3c3c;
    margin-bottom: 24px;
    padding: 16px;
    text-align: center;
}
.fs-c-sortItems__list__item.is-active {
background:#7a5743;
}
.fs-p-inputGroup {
border: 1px solid #7a5743;
background: #7a5743;
}
.fs-p-inputGroup__button {
    background: #7a5743;
}
.fs-p-scrollingCartButton__button {
    background: #7a5743;
}
.fs-p-footerPageTop__link {
    background-color: #7a5743;
}
.fs-c-subgroupList__label {
margin: 0 0 0 10px;
}
.fs-l-header {
padding-top: 0;
}
@media screen and (min-width: 768px) {
  .fs-c-subgroupList__item {
    flex-basis: calc(50% + 1px);
  }
}

@media screen and (min-width: 960px) {
  .fs-c-subgroupList__item {
    flex-basis: calc(50% + 1px);
  }
}
.fs-p-card__title{
padding: 0 0 0 0;
}
.fs-c-productPointDisplay{
    background: #ffffff;
    color: #c39e46;
    display: inline-block;
    font-size: 1.4em;
    line-height: 1;
    border: 1px solid #cba979;
    border-radius: 40px;
    padding: 6px 16px 5px 16px;
    margin: 0 auto;
}
.fs-c-productPointDisplay__unit{
    font-size: 0.8em;
    font-weight:bold;
}
.fs-c-productNameHeading__name{
    font-size: 1.4em;
}
.fs-c-button__label{
    font-size: 1.2em;
    font-weight:bold;
}
.fs-c-button--particular{
    box-shadow: none;
}
.fs-c-button--primary{
    min-width:100%;
}
.fs-c-heading--page {
    padding: 1.2em 0 1.2em;
}
.fs-c-documentArticle__heading {
    background: #8f8f8f;
    font-size: 1.8rem;
    padding: 8px;
}





@media screen and (max-width: 2000px) {
.clearfix {
   display: block;
}
   .column2L, .column2R {
    float: left;
}
   .width30L {
    width: 30%;
    margin-right: 5%;
    margin-bottom: 5%;
}
   .width70R {
    width: 65%;
    margin-bottom: 5%;
}
.width70L {
    width: 65%;
    margin-right: 5%;
    margin-bottom: 5%;
}
.width30R {
    width: 30%;
    margin-bottom: 5%;
}
}

@media screen and (max-width: 1000px) {
.clearfix {
   display: block;
}
   .column2L, .column2R {
    float: left;
}
   .width30L {
    width: 30%;
    margin-right: 5%;
    margin-bottom: 5%;
}
   .width70R {
    width: 65%;
    margin-bottom: 5%;
}
.width70L {
    width: 65%;
    margin-right: 5%;
    margin-bottom: 5%;
}
.width30R {
    width: 30%;
    margin-bottom: 5%;
}
}

@media screen and (max-width: 480px){
.clearfix {
   display: block;
}
   .column2L, .column2R {
   float: none;
   width: 100%!important;
}
   .width30L {
   margin-right: 5%;
    margin-bottom: 5%;
}
   .width70R {
    margin-bottom: 5%;
}
.width70L {
    margin-right: 5%;
    margin-bottom: 5%;
}
.width30R {
    margin-bottom: 5%;
}
}



*/商品詳細*/
.item-shosai {
    margin-left:0.1%;
    margin-right:0.1%;
    margin-top:0;
    margin-bottom:0;
    float: left;
    width: 80%;
}
.item-shosai2 {
    margin-left:0.1%;
    margin-right:0.1%;
    margin-top:0;
    margin-bottom:0;
    float: left;
    width: 80%;
}

.summary{
border: 1px solid #E48898;
border-radius: 3px 30px 3px 40px;
width: auto;
height: auto;
padding: 20px;
display: inline-block;
margin: 20px auto;
}

.summary span{
font-weight:bold;
font-size:large;
}

.summary_zo{
border: 1px solid #1010aa;
border-radius: 3px 30px 3px 40px;
width: auto;
height: auto;
padding: 20px;
display: inline-block;
margin: 20px auto;
}

.summary_zo span{
font-weight:bold;
font-size:large;
}
.no_pink{
background: #FFDBED;
color:#000000;
padding: 3px 5px;
font-weight:bold;
}

.att_list{
font-size:x-small;
}

.point {
color: #E48898;
border-bottom: 1px dotted #a5a5a5;
font-size: 18px;
font-weight: bold;
padding-bottom: 0px;
margin: 30px 0 15px;
}

.section_space3 h4{
font-weight:bold;
font-size:1.2em;
}

    
@media screen and (max-width: 2000px) {
    .item-shosai {
    padding: 0 0 0 0.1%;
    margin: 0 auto;
    width: 100%;
}
    .items {
        margin-left:0.1%;
        margin-right:1%;
        margin-top:0;
        margin-bottom:0;
        float: left;
        width: 48%;
    }
    .item-shosai2 {
    padding: 0 0 0 0.1%;
    margin: 0 auto;
    width: 100%;
    }
    .items2 {
        margin-left:0.1%;
        margin-right:0.1%;
        margin-top:0;
        margin-bottom:0;
        float: left;
        width: 98%;
    }
    .zo-2-pc {
    display: block;
  }
    .zo-2-sp {
     display: none;
  }
}    
@media screen and (max-width: 1000px) {
    .item-shosai {
    padding: 0 0 0 1.4%;
    margin: 0 auto;
    width: 100%;
}
    .items {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:0;
        margin-bottom:0;
        float: left;
        width: 48%;
    }
    .item-shosai2 {
    padding: 0 0 0 1.4%;
    margin: 0 auto;
    width: 100%;
}
    .items2 {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:0;
        margin-bottom:3px;
        float: left;
        width: 98%;
    }
    .zo-2-pc {
    display: block;
  }
    .zo-2-sp {
     display: none;
  }
}
@media screen and (max-width: 700px) {
    .item-shosai {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .items {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:0;
        margin-bottom:0;
        float: left;
        width: 48%;
    }
    .item-shosai2 {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .items2 {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:0;
        margin-bottom:0;
        float: left;
        width: 98%;
    }    .zo-2-pc {
    display: block;
  }
    .zo-2-sp {
     display: none;
  }
}

@media screen and (max-width: 600px) {
    .item-shosai {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .items {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:0;
        margin-bottom:3px;
        float: left;
        width: 98%;
    }
    .item-shosai2 {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .items2 {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:0;
        margin-bottom:0;
        float: left;
        width: 98%;
    }
  .zo-2-pc {
    display: block;
  }
    .zo-2-sp {
     display: none;
  }
}

.itempage-movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.itempage-movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.section_space3{
        margin-bottom:4.0em;
}

h3.subtitle{
        display: inline-block;
        font-size: 1.2em;
        color: #ffffff;
        padding: 9px 3em;
        background:#E48898;
        margin-bottom: 10px!important;
}
h3.subtitle-n{
        display: inline-block;
        font-size: 1.2em;
        color: #ffffff;
        padding: 9px 3em;
        background:#2688a8;
        padding: 9px 3em;
        margin-bottom: 10px!important;
}
h3.subtitle-q{
        display: inline-block;
        font-size: 1.2em;
        color: #ffffff;
        padding: 9px 3em;
        background:#439f98;
        padding: 9px 3em;
        margin-bottom: 10px!important;
}
h3.subtitle-b{
        display: inline-block;
        font-size: 1.2em;
        color: #ffffff;
        padding: 9px 3em;
        background:#E48898;
        padding: 9px 3em;
        margin-bottom: 10px!important;
}

h3.subtitle-b2{
        display: inline-block;
        font-size: 1.2em;
        color: #333;
        padding: 9px 3em;
        background:#eee;
        padding: 9px 3em;
        margin-bottom: 10px!important;
}

.zo-biyoeki{
	font-size:1.2em;
	background:#1010aa;
	color: #ffffff;
	padding: 5px 20px;
}

.zo-sengan{
	font-size:1.2em;
	background:#00b5e2;
	color: #ffffff;
	padding: 5px 20px;
}

.zo-kesyosui{
	font-size:1.2em;
	background:#0080d6;
	color: #ffffff;
	padding: 5px 20px;
}

.zo-teirechi{
	font-size:1.2em;
	background:#ff99cc;
	color: #ffffff;
	padding: 5px 20px;
}

.zo-korechi{
	font-size:1.2em;
	background:#ff3399;
	color: #ffffff;
	padding: 5px 20px;
}

.zo-hiyakedome{
	font-size:1.2em;
	background:#13bbb1;
	color: #ffffff;
	padding: 5px 20px;
}

.zo-bodycream{
	font-size:1.2em;
	background:#4b0082;
	color: #ffffff;
	padding: 5px 20px;
}

h3.zo{
        display: inline-block;
        font-size: 1.2em;
        background: #1010aa;
        color: #ffffff;
        padding: 9px 3em;
        font-weight:normal;
        margin-bottom: 10px!important;
}
h4.zo{
        font-size:1.2em;
        font-weight:bold;
        margin-top: 0;
        margin-bottom: 0;
}
p.zo{
        margin-top:0;
}
p.zo::last{
        margin-bottom:5%;
}
p.eye_chtch{
        color: #ff4b54;
        font-size: 1.2em;
        line-height: 2em;
        font-weight: bold;
        font-family: "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
        text-align: center;
}


*/汎用*/
.clearfix:after,.cf:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	font-size:0.1em;
	line-height:0;
	visibility:hidden;
	overflow:hidden;
}
.clearfix,.cf{
	display:inline-table;
}
.column2L,.column2R{
	float: left;
}
.column3{
	float:left;
	width:29.3%;
	padding:2%;
}
.column5{
	float:left;
	width:19%;
	padding:0.5%;
}
.width25R{
	width:25%;
	margin-bottom: 5%;
}
.width25L{
	width:25%;
	margin-right: 5%;
}
.width75R{
	width:70%;
	margin-bottom: 5%;
}
.width75L{
	width:70%;
	margin-right: 5%;
}
.width30L{
	width:30%;
	margin-right: 5%;
}
.width70R{
	width:65%;
	/*margin-bottom: 5%;*/
}
.width70L{
	width:65%;
	margin-right: 5%;
}
.width30R{
	width:30%;
	/*margin-bottom: 5%;*/
}
.width40L{
	width:40%;
	margin-right: 5%;
}
.width60R{
	width:55%;
	margin-bottom: 5%;
}
.width60L{
	width:55%;
	margin-right: 5%;
}
.width40R{
	width:40%;
	margin-bottom: 5%;
}
.width50L{
	width:47.5%;
	margin-right: 5%;
}
.width50R{
	width:47.5%;
	/*margin-bottom: 5%;*/
}
.well_column2_wrap{
  display: -webkit-box; /*Android4.3*/
  display: -moz-box;    /*Firefox21*/
  display: -ms-flexbox; /*IE10*/
  display: -webkit-flex; /*PC-Safari,iOS8.4*/
  display: flex
}
.well_column2L{
	width:44%;
	margin-right: 2%;
    padding: 2% 3%;
    border: 1px solid #ddd;
    border-radius: 6px;
    background-color: #fafafa;
}
.well_column2R{
	width:44%;
    padding: 2% 3%;
    border: 1px solid #ddd;
    border-radius: 6px;
    background-color: #fafafa;
}
.well_column2L_red{
	width:44%;
	margin-right: 2%;
    padding: 2% 3%;
    border: 1px solid #f2dede;
    border-radius: 6px;
    border-color: #ebccd1;
}
.well_column2R_red{
	width:44%;
    padding: 2% 3%;
    border: 1px solid #f2dede;
    border-radius: 6px;
    border-color: #ebccd1;
}
.well_column2L_blue{
	width:44%;
	margin-right: 2%;
    padding: 2% 3%;
    border: 1px solid #bce8f1;
    border-radius: 6px;
    background-color: #d9edf7;
}
.well_column2R_blue{
	width:44%;
    padding: 2% 3%;
    border: 1px solid #bce8f1;
    border-radius: 6px;
    background-color: #d9edf7;
}
.well_column2L_green{
	width:44%;
	margin-right: 2%;
    padding: 2% 3%;
    border: 1px solid #d6e9c6;
    border-radius: 6px;
    background-color: #dff0d8;
}
.well_column2R_green{
	width:44%;
    padding: 2% 3%;
    border: 1px solid #d6e9c6;
    border-radius: 6px;
    background-color: #dff0d8;
}
.well_column2L_yellow{
	width:44%;
	margin-right: 2%;
    padding: 2% 3%;
    border: 1px solid #faebcc;
    border-radius: 6px;
    background-color: #fcf8e3;
}
.well_column2R_yellow{
	width:44%;
    padding: 2% 3%;
    border: 1px solid #faebcc;
    border-radius: 6px;
    background-color: #fcf8e3;
}
.well2_column2L {
    width: 44%;
    margin-right: 2%;
    padding: 2% 3%;
    border: 1px solid #ddd;
    background-color: white;
}
.well2_column2R {
    width: 44%;
    padding: 2% 3%;
    border: 1px solid #ddd;
    background-color: white;
}
.well ul{
	margin-bottom:0;
}
.well_column2L h4, .well_column2R h4,.well_column2L_red h4, .well_column2R_red h4,.well_column2L_blue h4, .well_column2R_blue h4,.well_column2L_green h4, .well_column2R_green h4,.well_column2L_yellow h4, .well_column2R_yellow h4{
    font-size: 1.3em;
    border-bottom: 1px solid;
    margin-bottom: 5% !important;
}
.well_inline1 {
    padding: 0.5em 1em!important;
    border: 1px solid #ddd;
    background: #fafafa;
    font-size: 1em!important;
    font-weight: 100;
    display:inline-block;
}
.well_inline2 {
    background-color: #10069F;
    padding: 2% 3%!important;
    color: #fff;
    font-size: 0.8em!important;
    display: inline-block;
    font-weight: 100;
}
.mb5 {
    margin-bottom: 2%!important;
}
@media screen and (max-width: 480px) {
	.column2L,.column2R{
		float: none;
		width:100%!important;
	}
	.column2L img,.column2R img{
		width: 70%!important;
		margin: 0 15%;
	}
	.column3,.column5{
		width: 86%!important;
		margin: 0 5%;
	}
	.well_column2_wrap{
		display:block;
	}
	.well2_column2L,.well2_column2R,.well_column2L,.well_column2R{
		width:86%;
		margin-bottom: 5%;
		padding: 7%;
	}
}

.box_fusen {
    padding: 2em 2em;
    margin: 2em 0;
    color: #232323;
    background: #fffef0;
    border-left: solid 20px #fff959;
}
.box_fusen p {
    margin: 0; 
    padding: 0;
}



    .zo-2-pc {
    display: block;
  }
    .zo-2-sp {
     display: none;
  }



*/動画エリア*/
.movie-contents{
padding: 0;
margin: 0 auto;
}
.seiko-youtube {
position: relative;
width: 80%;
padding-top: 56.25%;
margin: 0 auto;
}
.seiko-youtube iframe {
position: absolute;
top: 0;
right: 0;
width: 100% !important;
height: 100% !important;
}
.seikomedical-title {
padding: 20px 10px 6px 10px;
color: #ff6699;
font-size: 1.4em;
text-align: center;
}
.seikomedical-textbox {
padding: 0;
margin: 0 auto;
}
.seikomedical-text {
padding: 20px 10px 0 10px;
color: #888888;
}

*/バナーエリア*/
.banner {
    margin:0 auto;
    width: 90%;
}
    
@media screen and (max-width: 2000px) {
    .banner-box {
    padding: 40px 0 40px 0;
    margin: 0 auto;
    width: 92%;
    text-align: cennter;
}
.pc { display: block !important; }
.sp { display: none !important; }
}    
@media screen and (max-width: 1000px) {
    .banner-box {
    padding: 30px 0 30px 0;
    margin: 0 auto;
    width: 92%;
    text-align: cennter;
}
.pc { display: block !important; }
.sp { display: none !important; }
}
@media screen and (max-width: 700px) {
    .banner-box {
    padding: 5px 0 5px 0;
    margin: 0 auto;
    width: 98%;
    text-align: cennter;
}
.pc { display: none !important; }
.sp { display: block !important; }
}

@media screen and (max-width: 600px) {
    .banner-box {
    padding: 5px 0 5px 0;
    margin: 0 auto;
    width: 98%;
    text-align: cennter;
}
.pc { display: none !important; }
.sp { display: block !important; }
}





@import url(https://fonts.googleapis.com/css?family=Pacifico);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans);

/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;}
ul{list-style:none;}
table{border-collapse:collapse;border-spacing:0;}
caption,th{text-align:left;}
q:before,q:after{content:'';}
object,embed{vertical-align:top;}
legend{display:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
img,abbr,acronym,fieldset{border:0;}

body{
	font: 14px/1.9 'Noto Sans JP', Arial, Verdana, 游ゴシック, YuGothic,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', メイリオ, Meiryo,sans-serif;
	font-weight: 300;
	-webkit-text-size-adjust:100%;
	overflow-x: hidden;
	color: #000;
	background: #fff;
}

a{
	color: #000;
	text-decoration: none;
}

a:hover, .active{
  text-decoration: none;
}

a:active, a:focus,input:active, input:focus{outline:0;}


/* ヘッダー
------------------------------------------------------------*/
#header{
	position: relative;
    width:30%;
    height:auto;
	z-index:500;
}

#header img{
    position:absolute;
	text-align: left;
	padding-left: 30px;
	padding-top: 10px;
}

#slogan{
	position: absolute;
  top: 85%;
	width: 100%;
	-webkit-transform: translate(0, -50%);
  transform: translate(0, -50%);
	color: #fff;
	line-height: 1.2;
	text-align: center;
}

#slogan h1{
	font-size: 40px;
	font-family: 'Pacifico', cursive;
	margin-bottom: 20px;
	font-weight:normal;
}

#slogan h2{
	font-size: 20px;
	font-weight:normal;
}


/* フッター
------------------------------------------------------------*/
#footer{
	clear: both;
	padding: 50px 10px 50px 0;
	text-align: center;
	font-size: 12px;
}


/* 共通
------------------------------------------------------------*/
h1, h2{
	font-family: 'Josefin Sans', 'Noto Sans JP',serif;
}

/*img{
	width: 100%;
	height: auto;
}*/

#header img{
	width: 90%;
	height: auto;
}

section{clear:both;}

section h2{
	font-size: 2.2em;
	font-weight:normal;
	text-align: center;
}

section h3{
	font-size: 1.0em;
	font-weight:normal;
	text-align: center;
}

.inner{
	width: 94%;
	margin: 0 auto;
	padding-bottom: 50px;
}

.col2 li{
	display: inline-block;
	width: 100%;
  	margin: 20px 0 20px 0;
}


/* SEC01 VISION
------------------------------------------------------------*/

.vision{
	width: 60%;
	margin: 0 auto;
	padding-bottom: 80px;
}


/* SEC02 MESSAGE
------------------------------------------------------------*/
.wrap{
	clear: both;
	width: 100%;
	background: #f6f6f6;
}

.bg{
	line-height: 0;
}

.txt h2{
	padding: 0 0 0 !important;
}

.txt h3{
	padding: 0 0 20px !important;
}


/* SEC03 SERVICE MESSAGE STORY
------------------------------------------------------------*/
.col3 li{
	margin-bottom: 0;
}

.col3 img{
	max-width: 288px;
	display: block;
	margin: 0 auto 20px;
}


/* SEC03 SERVICE MESSAGE STORY
------------------------------------------------------------*/
.col3_footer li{
	max-width: 31%;
	display: block;
	margin: 0 auto 0.5%;
}


/* SEC04 STORY & SUCCESS
------------------------------------------------------------*/
#sec04{
	background: url(https://seikomedical.itembox.design/item/image/bgSec04.jpg?t=20241030152226) no-repeat 100% 100% fixed;
	background-size: cover;
	-webkit-background-size: cover;
	color: #000;
}


/* SEC05 PROFILE
------------------------------------------------------------*/
#sec05{
	padding-top: 20px;
	background-color: #f7f7f7;
}

#sec05 dl{
	line-height: 1.2;
}

#sec05 dt{
	clear: left;
	float: left;
	display: block;
	width: 30%;
	margin-right: 10%;
	margin-bottom: 20px;
	text-align: right;
	line-height: 1.6em;
}

#sec05 dd{
	width: 60%;
	float: left;
	text-align: left;
	margin-bottom: 15px;
	line-height: 1.6em;
}

#sec05 header{
	display: none;
}

#map{
	position: relative;
	padding-bottom: 75%;
	height: 0;
	overflow: hidden;
}

#map iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
	border: 0;
}


/* SEC06 GUIDE
------------------------------------------------------------*/

.guide{
	width: 80%;
	margin: 0 auto;
	padding-top: 80px;
	padding-bottom: 80px;
	background-color: #fff;
}


/* RESPONSIVE 設定
------------------------------------------------------------*/

@media only screen and (min-width: 1200px){
	.inner{
		width: 1024px;
		padding-bottom: 30px;
	}
	section header h2{
		padding: 50px 0 0;
	}
	section h3{
		padding: 0 0 20px;
	}
	.txt h2{
		padding: 0 0 0 !important;
	}
	.txt h3{
		padding: 0 0 20px !important;
	}
	
	#header{
	position: fixed;
    width:30%;
    height:auto;
	z-index:500;
    }

    #header img{
    position:absolute;
	text-align: left;
	padding-left: 30px;
	padding-top: 10px;
    }
}

@media only screen and (min-width: 800px){
	body{
		font-size:14px;
	}
	
  a#menu{
		display:none;
	}	

	.panel{
		display:block !important;
	}

	#mainnav{
		position:fixed;
		width:100%;
		z-index:500;
		background: rgba(255,255,255,.9)!important;
		border-bottom: 1px solid #d1d1d1!important;
	}

	#mainnav ul{
		text-align: right;
		padding-right: 30px;
	}

	#mainnav li{
		display: inline-block;
		padding: 45px 10px 20px;
		font-size: 14px;
		font-weight: 300;
	}
	
  #mainnav a{
		color: #000;
	}
	
	#mainnav.changeNav{
		background: rgba(255,255,255,.9)!important;
		border-bottom: 1px solid #d1d1d1!important;
	}
	
	#mainnav.changeNav li{
		padding: 20px 10px;
	}

	/* SEC02 MESSAGE
	-----------------*/
	.txt, .bg{
		width: 50%;
		float: left;
		display: table;
	background: #f6f6f6;
	}

	#sec02_02 .txt, #sec02_02 .bg{
		float: right;
	}

	.vMid{
		display: table-cell;
		padding: 0 100px;
		vertical-align: middle;
	}
	
	/* SEC03 SERVICE MESSAGE STORY
	-----------------*/
	.col3{
		text-align: center;
	}

	.col3 li{
		display: inline-block;
		width: 30%;
		padding: 0 1.5%;
		margin-bottom: 10px;
		vertical-align: top;
		text-align: center;
	}
	
	/* SEC03 SERVICE MESSAGE STORY
	-----------------*/
	.col3_footer{
		text-align: center;
	}

	.col3_footer li{
		display: inline-block;
		width: 30%;
		padding: 0 1.5%;
		margin-bottom: 10px;
		vertical-align: top;
		text-align: left;
	}
	
	/* SEC05 PROFILE
	-----------------*/
	#sec05{
		padding-top: 20px;
	}
	
  #footer{
		padding: 30px 10px 30px 0;
	}
	
	#header{
	position: fixed;
    width:30%;
    height:auto;
	z-index:500;
    }

    #header img{
    position:absolute;
	text-align: left;
	padding-left: 30px;
	padding-top: 10px;
    }

.product-img-area {
    width: 45%;
    margin-right: 5%;
    }
.pruduct-info-area {
    width: 50%;
    }

}

@media only screen and (min-width: 641px){
	.col2 li{
		width: /*40%*/49%;
		padding: 0 3%;
		vertical-align: top;
	}
	
	#header{
	position: absolute;
    width:35%;
    height:auto;
	z-index:500;
    }

    #header img{
    position:absolute;
	text-align: left;
	padding-left: 15px;
	padding-top: 10px;
    }
}

@media only screen and (max-width: 640px){
	#map iframe{
	  width: 96% !important;
		left: 2%;
	}
	
	#header{
	position: fixed;
    width:70%;
    height:auto;
	z-index:500;
    }

    #header img{
    position:absolute;
	text-align: left;
	padding-left: 15px;
	padding-top: 10px;
    }
}

@media only screen and (max-width: 799px){
	#slogan h1{
		font-size: 31px;
	}

	#slogan h2{
		font-size: 16px;
	}

  a#menu{
  	display: inline-block;
  	position: relative;
  	width: 40px;
  	height: 40px;
  	margin: 10px;
	}

	#menuBtn{
  	display: block;
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	width: 18px;
  	height: 2px;
  	margin: -1px 0 0 -7px;
  	background: #000;
  	transition: .2s;
	}

	#menuBtn:before, #menuBtn:after{
  	display: block;
  	content: "";
  	position: absolute;
  	top: 50%;
  	left: 0;
  	width: 18px;
  	height: 2px;
  	background: #000;
  	transition: .3s;
	}

	#menuBtn:before{
  	margin-top: -7px;
	}

	#menuBtn:after{
  	margin-top: 5px;
	}

	a#menu .close{
  	background: transparent;
	}

	a#menu .close:before, a#menu .close:after{
  	margin-top: 0;
	}

	a#menu .close:before{
  	transform: rotate(-45deg);
  	-webkit-transform: rotate(-45deg);
	}

	a#menu .close:after{
  	transform: rotate(-135deg);
  	-webkit-transform: rotate(-135deg);
	}

	.panel{
		width: 100%;
		display: none;
		overflow: hidden;
		position: relative;
		left: 0;
		top: 0;
		z-index: 100;
	}

	#mainnav{
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		text-align: right;
		z-index:500;
	}

	#mainnav ul{
		border-bottom: 1px solid #ccc;
		background: #fff;
		text-align: left;
	}

	#mainnav li a{
		position: relative;
		display:block;
		padding:15px 25px;
		border-bottom: 1px solid #ccc;
		color: #000;
		font-weight: 400;
	}

	#mainnav li a:before{
		display: block;
		content: "";
		position: absolute;
		top: 50%;
		left: 5px;
		width: 6px;
		height: 6px;
		margin: -4px 0 0 0;
		border-top: solid 2px #000;
		border-right: solid 2px #000;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
	}

	#mainnav li form{
		position: relative;
		display:block;
		margin:15px 0 15px 10px;
		color: #000;
		font-weight: 400;
	}
	
	/* SEC03 SERVICE MESSAGE STORY
	-----------------*/
	.col3{
		text-align: center;
	}

	.col3 li{
		display: inline-block;
		width: 30%;
		padding: 0 1.5%;
		margin-bottom: 0;
		vertical-align: top;
		text-align: center;
		font-size: 12px;
	}
	
	/* SEC03 SERVICE MESSAGE STORY
	-----------------*/
	.col3_footer{
		display: none;
	}

	.col3_footer li{
		display: none;
	}
	
	#header{
	position: absolute;
    width:70%;
    height:auto;
	z-index:500;
    }

    #header img{
    position:absolute;
	text-align: left;
	padding-left: 15px;
	padding-top: 10px;
    }
}

@media only screen and (max-width: 1199px){
	/*section p{
		padding: 0 0 40px 0;
	}*/
	section header h2{
		padding: 50px 0 0 0;
	}
	section h3{
		padding: 0 0 20px 0;
	}
	#sec01 h2{
		padding: 40px 0 0;
	}
	#sec01 h3{
		padding: 0 0 20px;
	}
	#sec06 h2{
		padding: 40px 0 0;
	}
	#sec06 h3{
		padding: 0 0 20px;
	}
	.vMid{
		padding: 0 20px;
	}
}


*/-------------------------------------
　カテゴリ別
-------------------------------------*/
.category {
    margin-left:0.1%;
    margin-right:0.1%;
    margin-top:2px;
    margin-bottom:2px;
    float: left;
    width: 24%;
}
    
@media screen and (max-width: 2000px) {
    .category-box {
    padding: 0 0 0 0.1%;
    margin: 0 auto;
    width: 88%;
}
    .category {
        margin-left:1%;
        margin-right:0.2%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 15%;
    }
}    
@media screen and (max-width: 1000px) {
    .category-box {
    padding: 0 0 0 1.4%;
    margin: 0 auto;
    width: 88%;
}
    .category {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 31%;
    }
}
@media screen and (max-width: 700px) {
    .category-box {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .category {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 31%;
    }
}

@media screen and (max-width: 600px) {
    .category-box {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .category {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:4px;
        margin-bottom:4px;
        float: left;
        width: 31%;
    }
}



*/-------------------------------------
　メーカー別
-------------------------------------*/
.manufacturer {
    margin-left:0.1%;
    margin-right:0.1%;
    margin-top:2px;
    margin-bottom:2px;
    float: left;
    width: 24%;
}
    
@media screen and (max-width: 2000px) {
    .manufacturer-box {
    padding: 0 0 0 1%;
    margin: 0 auto;
    width: 90%;
}
    .manufacturer {
        margin-left:0.3%;
        margin-right:0.3%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 24%;
    }
}    
@media screen and (max-width: 1000px) {
    .manufacturer-box {
    padding: 0 0 0 0.5%;
    margin: 0 auto;
    width: 88%;
}
    .manufacturer {
        margin-left:0.5%;
        margin-right:0.5%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 48%;
    }
}
@media screen and (max-width: 700px) {
    .manufacturer-box {
    padding: 0 0 30px 0.5%;
    margin: 0 auto;
    width: 98%;
}
    .manufacturer {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:3px;
        margin-bottom:3px;
        float: left;
        width: 48%;
    }
}

@media screen and (max-width: 600px) {
    .manufacturer-box {
    padding: 0 0 30px 0.5%;
    margin: 0 auto;
    width: 98%;
}
    .manufacturer {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:3px;
        margin-bottom:3px;
        float: left;
        width: 48%;
    }
}


*/-------------------------------------
　バナー
-------------------------------------*/
.banner-box{
    margin-left:0.1%;
    margin-right:0.1%;
    margin-top:2px;
    margin-bottom:2px;
    float: left;
    width: 100%;
}
    
@media screen and (max-width: 2000px) {
    .banner-box {
    padding: 0 0 30px 1.9%;
    margin: 0 auto;
    width: 98%;
}
    .banner {
        margin-left:0.1%;
        margin-right:0.1%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 49%;
    }
}    
@media screen and (max-width: 1000px) {
    .banner-box {
    padding: 0 0 30px 1.2%;
    margin: 0 auto;
    width: 98%;
}
    .banner {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 48%;
    }
}
@media screen and (max-width: 700px) {
    .banner-box {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .banner {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:5px;
        margin-bottom:5px;
        float: left;
        width: 98%;
    }
}

@media screen and (max-width: 600px) {
    .banner-box {
    padding: 0 0 30px 1.4%;
    margin: 0 auto;
    width: 98%;
}
    .banner {
        margin-left:0.7%;
        margin-right:0.7%;
        margin-top:4px;
        margin-bottom:4px;
        float: left;
        width: 98%;
    }
}



.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}


/* ボタン
------------------------------------------------------------*/

.btn--login,
a.btn--login {
  color: #fff;
  background-color: #7a5743;
}
.btn--login:hover,
a.btn--login:hover {
  color: #fff;
  background: #bc8160;
}
.btn--new,
a.btn--new {
  color: #fff;
  background-color: #cba979;
}
.btn--new:hover,
a.btn--new:hover {
  color: #fff;
  background: #e6c08b;
}
a.btn--radius {
   border-radius: 100vh;
   padding: 8px 30px;
}