@charset 'UTF-8';

/*! body */
.innerBox{position:relative;width:96%;max-width:1000px;margin:0 auto;}

/*! anchor */
.anchorBox{position:absolute;top:0;left:10px;}
.anchorBox_left{position:absolute;top:0;left:10px;}
.anchorBox_right{position:absolute;top:40px;right:10px;}
@media only screen and (min-width:1400px){
  .anchorBox_left{display:none;}
}
@media only screen and (max-width:1400px){
  .anchorBox,.anchorBox_left{display:none;}
}
.flexBox{display:-webkit-box;display:-ms-flexbox;display:flex;margin:0 auto;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:stretch;-ms-flex-align:stretch;flex-wrap:wrap;}

/*! ttlBoxPC */
#ttlBoxPC{position:relative;z-index:1;clear:both;height:auto;margin:0;padding:0;text-align:center;background:#6090a4;}
#ttlBoxPC .innerBox{width:100%;max-width:1500px;margin:50px auto 0;}
#ttlBoxPC .infoBox{position:absolute;top:0;left:16%;}
#ttlBoxPC h1{position:relative;width:1500px;margin:0 auto;}
#ttlBoxPC .color{margin-top:0;}
#ttlBoxPC .color_your_style{margin-top:25px;}
#ttlBoxPC .color_text{margin-top:25px;}
#ttlBoxPC .ttl_news{position:relative;width:500px;margin-top:160px;padding:10px 40px 10px 25px;border-radius:20px;background:rgba(255,255,255,.5);}
#ttlBoxPC .ttl_news p{font-size:16px;overflow:hidden;white-space:nowrap;letter-spacing:.05em;text-overflow:ellipsis;}
#ttlBoxPC .ttl_news:after{position:absolute;top:9px;right:15px;content:'→';}

/*! ttlBoxSP */
@media only screen and (max-width:767px){
  #ttlBoxSP{clear:both;height:auto;margin:0;padding:0;text-align:center;}
  #ttlBoxSP h1{position:relative;z-index:0;margin:0 auto;}
}

/*! concept */
#concept{position:relative;clear:both;margin-top:75px;text-align:center;background:#fff;}
#concept .bacground{position:relative;z-index:1;}
#concept .flexBox{width:1000px;padding:40px 0;flex-wrap:nowrap;}
#concept .flexBox .leftBox{text-align:left;}
#concept .flexBox .rightBox{text-align:right;}
#concept h1{margin-top:130px;}
#concept h2{margin-right:-90px;}
#concept .catch{display:block;margin-top:30px;}
#concept .cys{display:block;margin-top:30px;}
#concept .concept_bg{position:absolute;z-index:0;top:0;left:0;width:100%;height:400px;height:100%;background:linear-gradient(110deg,#fff 0%,#fff 46%,#231815 46%,#231815 100%);}
@media only screen and (max-width:960px){
  #concept .flexBox .leftBox{padding-left:10px;}
  #concept .flexBox .rightBox{padding-right:10px;}
}
@media only screen and (max-width:767px){
  #concept{margin-top:16vw;}
  #concept h1{margin:15vw auto;}
  #concept h2{margin:0 auto;}
  #concept .bacground{padding:16vw 8vw;background:#231815;}
  #concept .catch{margin-top:0;}
  #concept .cys{margin-top:30px;margin-left:-12px;}
}

/*! technology */
#technology{clear:both;margin-top:100px;text-align:left;background:#fff;}
#technology .text{margin-top:40px;}
#technology .flexBox{width:900px;margin:50px auto;padding-bottom:40px;border-bottom:1px solid #dcdddd;flex-wrap:nowrap;}
#technology .image{width:1260px;margin:50px 0 30px;}
#technology .infoBox1{width:1000px;margin:0 auto;padding:20px 0;text-align:center;background:#dcdddd;}
#technology .infoBox2{width:1000px;margin:50px auto 0;padding:20px 0;text-align:center;border:1px solid #231815;}
@media only screen and (max-width:767px){
  #technology{margin-top:21vw;text-align:center;}
  #technology .text{margin-top:4vw;}
  #technology .image{width:100%;margin:5vw 0 3vw;}
  #technology .image .image1{margin-right:10%;}
  #technology .image .image2{margin-top:-10vw;margin-left:10%;}
  #technology .image img{width:90%;}
  #technology .flexBox{flex-direction:column;width:90%;margin:5vw auto;padding-bottom:16vw;flex-wrap:wrap;}
  #technology .flexBox .smallBox{width:82%;margin:0 auto;}
  #technology .flexBox p{margin-top:8vw;}
  #technology .infoBox1{width:90%;margin:16vw auto 0;padding:8vw 4vw;}
  #technology .infoBox2{width:90%;margin:10vw auto 0;padding:10vw 5vw;}
}

/*! products */
#products{clear:both;margin-top:100px;text-align:left;background:#fff;}
#products .text{margin-top:40px;}
#products .image{width:1260px;margin:50px 0 30px;}
#products h3{margin-top:80px;}
#products .color_variations{position:relative;margin-top:70px;transition:all 1s;background:#fff;}
#products .color_variations .innerBox{border-top:1px solid #231815;border-bottom:1px solid #231815;}
#products .flexBox{width:900px;margin:40px auto 0;flex-wrap:nowrap;align-content:flex-start;}
#products .flexBox.status_sample{width:460px;margin:0;justify-content:space-between;align-items:center;align-content:flex-start;}
#products .colorBox{padding-bottom:50px;border-bottom:1px solid #3d322e;flex-wrap:wrap;}
#products .colorBox li{font-size:12px;width:24%;margin-top:20px;text-align:center;}
#products .colorBox li img{margin-top:10px;transition:all .1s;}
#products .colorBox li img:hover{cursor:pointer;transition:all .3s;-webkit-transform:scale(1.2);transform:scale(1.2);opacity:1;}
#products .material{padding-bottom:50px;flex-wrap:wrap;}
#products .material li{font-size:12px;width:24%;margin-top:20px;text-align:center;}
#products .material li img{margin-top:10px;transition:all .1s;}
#products .material li img:hover{cursor:pointer;transition:all .3s;-webkit-transform:scale(1.2);transform:scale(1.2);opacity:1;}
#products .color_variations.changed{transition:all 1s;background:#231815;}
#products .color_variations.changed .colorBox li{color:#fff;}
#products .notice{width:860px;padding:20px 0 0 85px;}
#products .base_material_lineup .innerBox .flexBox.material{justify-content:flex-start;}
#products .base_material_lineup .innerBox .flexBox.material li{margin-right:1.5%;}
#products .base_material_lineup .innerBox p{font-size:14px;}
@media only screen and (max-width:767px){
  #products{margin-top:21vw;text-align:center;}
  #products .innerBox{width:100%;}
  #products .text{margin-top:4vw;}
  #products .image{width:100%;margin:5vw 0 3vw;}
  #products .image .image1{margin-right:10%;}
  #products .image .image2{margin-top:-10vw;margin-left:10%;}
  #products .image img{width:90%;}
  #products h3{width:90%;margin-top:16vw;}
  #products .color_variations .innerBox{width:90%;}
  #products .flexBox{flex-direction:column;width:90%;margin:6vw auto 0;flex-wrap:wrap;}
  #products .flexBox.status_sample{flex-direction:row;width:82%;margin:5vw auto 0;flex-wrap:nowrap;}
  #products .flexBox .smallBox{width:82%;margin:0 auto;}
  #products .flexBox p{margin-top:4vw;}
  #products .colorBox{flex-direction:row;width:80%;padding-bottom:10vw;}
  #products .colorBox li{font-size:2.6vw;width:48%;margin-top:4vw;}
  #products .colorBox li img{margin-top:1vw;}
  #products .colorBox li img:hover{-webkit-transform:scale(1);transform:scale(1);opacity:1;}
  #products .base_material_lineup .innerBox{width:90%;}
  #products .material{flex-direction:row;width:80%;padding-bottom:10vw;}
  #products .material li{font-size:2.6vw;width:48%;margin-top:4vw;}
  #products .material li img{margin-top:1vw;}
  #products .material li img:hover{-webkit-transform:scale(1);transform:scale(1);opacity:1;}
  #products .notice{width:auto;margin-left:13%;padding:2vw 0 0;text-align:left;}
  #products .base_material_lineup .innerBox .flexBox.material{justify-content:space-between;}
  #products .base_material_lineup .innerBox .flexBox.material li{margin-right:0;}
  #products .base_material_lineup .innerBox p{font-size:3vw;}
}

/*! pickup */
#pickup{clear:both;margin-top:100px;text-align:left;background:#fff;}
#pickup .text{margin-top:40px;}
#pickup .image{width:1260px;margin:50px 0 30px;}
#pickup .flexBox{width:980px;margin:65px 0 0 50px;padding-bottom:40px;border-bottom:1px solid #9fa0a0;}
#pickup .flexBox li{width:46%;}
#pickup .flexBox li.switch{width:50%;}
#pickup .slider li,#pickup .slider_pro li{position:relative;overflow:hidden;width:100%;height:auto;}
#pickup .flexBox .use{margin-top:50px;padding-top:30px;border-top:1px solid #9fa0a0;}
#pickup .flexBox .base{margin-top:30px;padding-top:30px;border-top:1px solid #9fa0a0;}
#pickup .flexBox .flexBox{width:100%;margin:30px 0 0;text-align:center;border:none;}
#pickup .flexBox .flexBox li{width:48%;}
#pickup .flexBox .flexBox li img{margin-top:10px;}
#pickup .flexBox .caution{font-size:12px;position:relative;z-index:99;margin-top:-8px;}
@media only screen and (max-width:767px){
  #pickup{margin-top:12vw;text-align:center;}
  #pickup .innerBox{width:100%;}
  #pickup .text{margin-top:4vw;text-align:left;}
  #pickup .image{width:100%;margin:5vw 0 3vw;}
  #pickup .image .image1{margin-right:10%;}
  #pickup .image .image2{margin-top:-10vw;margin-left:10%;}
  #pickup .image img{width:90%;}
  #pickup .flexBox{flex-direction:column;width:90%;margin:10vw auto 0;padding-bottom:5vw;flex-wrap:wrap;}
  #pickup .flexBox li{font-size:2.8vw;width:100%;}
  #pickup .flexBox li.switch{width:82%;margin:6vw auto 0;}
  #pickup .flexBox li.smallBox{width:100%;margin:0 auto;text-align:left;}
  #pickup .flexBox li.smallBox p img{margin-left:8%;}
  #pickup .flexBox .flexBox{flex-direction:row;margin:5vw 0 0;}
  #pickup .flexBox .caution{font-size:2.5vw;margin-top:-2vw;}
  #pickup .flexBox .use{margin-top:8vw;padding-top:5vw;text-align:left;}
  #pickup .flexBox .base{margin-top:5vw;padding-top:5vw;text-align:left;}
}
@media only screen and (max-width:420px){
  #pickup .flexBox li.smallBox p img{margin-left:0;}
}

/*! pickup tab */
#pickup .tab-group{display:-webkit-box;display:-ms-flexbox;display:flex;width:1040px;margin:50px auto 0;padding-bottom:20px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:stretch;-ms-flex-align:stretch;flex-wrap:nowrap;}
#pickup .tab a{display:block;cursor:pointer;transition:all .5s;text-align:left;opacity:.3;flex-grow:1;}
#pickup .tab a.is-active{transition:all .5s;opacity:1;}
#pickup .tab:hover{transition:all .5s;opacity:1;}
#pickup .pickupTab_box{display:none;}
#pickup .pickupTab_box .flexBox{max-width:940px;}
#pickup .pickupTab_box:first-child{display:block;}
#pickup .pickupTab_box .flexBox li{font-size:12px;}
#pickup .pickupTab_box .flexBox li img{margin-top:10px;}
@media screen and (max-width:767px){
  #pickup .tab-group{flex-direction:column;width:90%;margin:10vw auto 0;}
  #pickup .tab{margin-bottom:5vw;}
  #pickup .panel-group{min-height:auto;}
  #pickup .panel{display:none;padding:1.2vw 5vw 3.6vw;text-align:left;}
  #pickup .pickupTab_box .flexBox li{font-size:2.6vw;}
  #pickup .pickupTab_box .flexBox li img{margin-top:1vw;}
}

/*! news */
#news{clear:both;margin-top:80px;text-align:left;background:#fff;}
#news .innerBox{clear:both;width:90%;margin:0 auto;}
#news .news_list{margin-top:50px;}
#news .news_list{clear:both;border-top:1px solid #231815;border-bottom:1px solid #231815;}
#news .topics dl{padding:15px 0;text-align:left;border-bottom:1px solid #ccc;}
#news .topics dt{font-size:14px;line-height:1.6;display:inline-block;width:15%;}
#news .topics dt span.news{display:none;}
#news .topics dd{font-size:14px;line-height:1.6;display:inline-block;}
#news .topics span{font-size:9px;line-height:1.4;margin-left:8px;padding:0 4px;color:#fff;background:#000;}
#news .btn_more{margin-top:50px;text-align:center;}
@media only screen and (max-width:767px){
  #news{margin-top:16vw;text-align:center;}
  #news .news_list{margin-top:10vw;}
  #news .topics dt{font-size:3.2vw;display:block;width:100%;padding-bottom:5px;}
  #news .topics dt span.news{display:inline;}
  #news .topics dd{font-size:3.2vw;display:block;margin-left:0;}
  #news .topics dd span.news{display:none;}
  #news .btn_more{margin-top:8vw;text-align:center;}
}

/*! caution */
#caution{clear:both;margin:100px auto 100px;text-align:left;background:#fff;}
#caution .innerBox{clear:both;width:90%;margin:0 auto;}
#caution .contentBox{margin-left:5%;}
#caution .contentBox .text{margin-top:80px;}
#caution .contentBox .image{margin-top:50px;padding-bottom:50px;border-bottom:1px solid #9fa0a0;}

/* #caution .contentBox p{font-size:18px;line-height:1.6;margin-top:30px;letter-spacing:.05em;} */
#caution .contentBox p{margin-top:40px;}
@media only screen and (max-width:767px){
  #caution{margin:16vw auto 14vw;text-align:center;}
  #caution .contentBox{margin-left:0;text-align:left;}
  #caution .contentBox .text{margin-top:12vw;}
  #caution .contentBox .image{margin-top:10vw;padding-bottom:10vw;text-align:center;}

  /* #caution .contentBox p{font-size:3vw;line-height:1.6;margin-top:8vw;letter-spacing:.05em;} */
  #caution .contentBox p{margin-top:5vw;margin-left:7vw;}
}

/*! cmn_btn_return */
div#notice01Box .cmn_btn_return{position:fixed;z-index:1000;right:30px;bottom:30px;display:none;box-sizing:border-box;}
@media (max-width:767px){
  div#notice01Box .cmn_btn_return{right:3vw;bottom:3vw;}
}


/* fixbtn */

.fixBTn{
	position: fixed;
	z-index: 10000;
}

main{
	display: block;
	position: relative;
}

#form{
    margin: 80px 0 0;
}

.iframeBlock{
    position:relative;
    width:100%;
    margin: 0 auto;
    max-width: 944px;
    height:0;
    padding-top:90%;
}
.iframeBlock iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

@media screen and (max-width: 767px) {
	#form{
		padding-bottom: 80px;
	}
	#form h2{
		text-align: center;
	}
	#form .inview-img{
		display: block;
	}
    .iframeBlock{
        padding-top:320%;
    }
	.fixBTn{
		max-width: 150px;
	}

}