@charset "utf-8";
/*=============================================================
 base Layout
=============================================================*/
/* a Element
--------------------------------------------------------------*/
a{
	color:#0053d5;
	text-decoration:none;
}
a:visited{color:#5d3fbb;}
a:hover{
	color:#0053d5;
	text-decoration:underline;
}
/* container
--------------------------------------------------------------*/
#container{
	overflow:hidden;
}
body,
#container{
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
/* pageBody
-------------------------------------------------------------*/
#pageBody{
	background: #fff;
}
/* contentsInner
-------------------------------------------------------------*/
.contentsInner{
	max-width:1128px;
	margin:0 auto;
	padding:0 40px;
}

/* contentsArea
-------------------------------------------------------------*/
#contentsArea{}

/* contents
-------------------------------------------------------------*/
#contents{
	line-height:1.85;
	/*margin-top:50px;
	padding-bottom:100px;*/
}
/* section
-------------------------------------------------------------*/
section + section{}


/*=============================================================
 font
=============================================================*/
.font01{font-family:'Noto Serif JP', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', serif;}

/*=============================================================
 animation
=============================================================*/
/* set ScrollMagic trigger
--------------------------------------------------------------*/
.setScMc,
.setScMcChild{transition:all 0.8s ease 0.2s;}
.setScMc.enter{}
.setScMcChild:nth-child(2){transition-delay:0.6s;}
.setScMcChild:nth-child(3){transition-delay:0.9s;}
.setScMcChild:nth-child(4){transition-delay:1.2s;}
.setScMcChild:nth-child(5){transition-delay:1.5s;}
.setScMcChild:nth-child(6){transition-delay:1.8s;}
.setScMcChild:nth-child(7){transition-delay:2.1s;}
.setScMcChild:nth-child(8){transition-delay:2.4s;}
.setScMcChild:nth-child(9){transition-delay:2.7s;}
.setScMcChild:nth-child(10){transition-delay:3s;}

/* animation-in-fadeSlide
-------------------------------------------------------------*/
.animation-in-fadeSlide{
	opacity:0;
	transform:translateY(40px);
	transition:all 0.6s ease 0.2s;
}
.animation-in-fadeSlide.enter,
.enter .setScMcChild.animation-in-fadeSlide{
	opacity:1;
	transform:translateY(0);
}
/*=============================================================
 text
=============================================================*/
/* h2
--------------------------------------------------------------*/

/* catch
--------------------------------------------------------------*/
.catch{
	font-size: calc(26px + ((1vw - 7.68px) * 8.28729));
	line-height: 1.4;
	text-align: center;
}
.catch + .box-white{margin-top: 80px;}
@media screen and (min-width:1128px) {
.catch{font-size: 56px;}
}

/* lead
--------------------------------------------------------------*/
.lead{
	font-size: 24px;
	line-height: 1.6;
	text-align: center;
}
.catch + .lead{margin-top: 65px;}

/*=============================================================
 link
=============================================================*/
/* overOpc
--------------------------------------------------------------*/
.overOpc{
	transition:opacity .3s;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
html:not(.touchDevice) .overOpc:hover,
html:not(.touchDevice) a:hover .overOpc{opacity:0.7;}

/* overSlide */
.overSlide{
	display:block;
	overflow:hidden;
	position:relative;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	transition:color .4s cubic-bezier(.275,0,0,1), border .3s;
}
html:not(.mobile) .overSlide:hover{
	color:#fff!important;
	border: 1px solid #fff!important;
}
html:not(.mobile) .revers .overSlide:hover{
	color:#000 !important;
	/*border: 1px solid #000!important;*/
}
.overSlide::before{
	content:"";
	background-color:#cf4246;
	display:block;
	height:100%;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	transition:.4s cubic-bezier(.275,0,0,1);
	-webkit-transform:translateX(-101%);
	transform:translateX(-101%);
}
.example-btn .overSlide::before,
.box-gray .overSlide::before,
.contact-area .overSlide::before{background-color:#000;}
.revers .overSlide::before{background-color:#fff;}
html:not(.mobile) .overSlide:hover::before{
	-webkit-transform:none;
	transform:none;
}
.overSlide>span{
	display:block;
	position:relative;
	z-index:1;
}

html:not(.mobile) .overSlide:hover img.imgIcon.blank,
html:not(.mobile) .overSlide:hover img.imgIcon.pdf,
html:not(.mobile) .overSlide:hover img.imgIconCart,
html:not(.mobile) .overSlide:hover img.imgIconMail,
html:not(.mobile) .overSlide:hover img.imgIconCatalog,
html:not(.mobile) .overSlide:hover img.imgIconOffice{transition:0s .1s;}
html:not(.mobile) .overSlide:not(.rev):hover img.imgIcon.blank{background-position:-15px 0;}
html:not(.mobile) .overSlide:not(.rev):hover img.imgIcon.pdf{background-position:-172px -20px;}
html:not(.mobile) .rev.overSlide:hover{color:#000 !important;}
.rev.overSlide::before{background-color:#fff;}
html:not(.mobile) .rev.overSlide:hover img.imgIcon.blank.white{background-position:0 0;}
html:not(.mobile) .rev.overSlide:hover img.imgIcon.pdf.white{background-position:-46px -20px;}
html:not(.mobile) .overSlide:not(.rev):hover img.imgIconCart{background:url("../img/parts_icon01_o.png") no-repeat;}
html:not(.mobile) .overSlide:not(.rev):hover img.imgIconMail{background:url("../img/parts_icon02_o.png") no-repeat;}
html:not(.mobile) .overSlide:not(.rev):hover img.imgIconCatalog{background:url("../img/parts_icon03_o.png") no-repeat;}
html:not(.mobile) .overSlide:not(.rev):hover img.imgIconOffice{background:url("../img/parts_icon04_o.png") no-repeat;}

/* overImgMv */
a.overImgMv,
a.overImgMv>.frame{
	display:block;
	overflow:hidden;
}
html:not(.mobile) a.overImgMv>img,
html:not(.mobile) a.overImgMv>.frame>img{transition:.5s;}
html:not(.mobile) a.overImgMv:hover>img,
html:not(.mobile) a.overImgMv:hover>.frame>img{
	opacity:0.7;
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	-webkit-transform:scale(1.06);
	transform:scale(1.06);
	transition:.8s;
}

/* imgIcon */
img.imgIcon{
	background:url(../img/parts_spr.png) no-repeat 0 0/auto 50px;
	vertical-align:-3px;
	width:20px;
	height:23px;
	margin:-3px 4px 0;
}
img.imgIcon.blank{
	vertical-align:0;
	width:14px;
	height:12px;
	margin-top:0;
}
img.imgIcon.blank.white{background-position:-15px 0;}
img.imgIcon.pdf{background-position:-46px -20px;}
img.imgIcon.pdf.white{background-position:-172px -20px;}
img.imgIconS{vertical-align:text-bottom;}

/* imgIconCart */
img.imgIconCart{
	background:url("../img/parts_icon01.png") no-repeat;
	vertical-align:-6px;
	width:32px;
	height:32px;
	margin-right: 10px;
}
/* imgIconMail */
img.imgIconMail{
	background:url("../img/parts_icon02.png") no-repeat;
	vertical-align:-6px;
	width:32px;
	height:32px;
	margin-right: 10px;
}
/* imgIconCatalog */
img.imgIconCatalog{
	background:url("../img/parts_icon03.png") no-repeat;
	vertical-align:-6px;
	width:32px;
	height:32px;
	margin-right: 10px;
}
/* imgIconOffice */
img.imgIconOffice{
	background:url("../img/parts_icon04.png") no-repeat;
	vertical-align:-6px;
	width:32px;
	height:32px;
	margin-right: 10px;
}
/* link
--------------------------------------------------------------*/
/* link-btn */
.link-btn:not(ul),
.link-btn>li{margin-top:20px;}
.link-btn:not(ul),
.link-btn>li{width:300px;}
.link-btn a{
	color:#fff;
	/*font-family:'Noto Serif JP', '游明朝', YuMincho, 'ヒラギノ明朝 ProN W3', 'Hiragino Mincho ProN', 'HG明朝E', serif;*/
	font-size:18px;
	line-height:1.35;
	text-decoration:none;
	background-color:#000;
	display:block;
	text-align:center;
	padding:17px 5px;
	border:1px solid #000;
}
/* link-btnL */
.link-btnL{
	text-align:center;
	margin-top:80px;
}
.link-btnL a{
	color:#000;
	font-size:20px;
	font-weight: 700;
	/*line-height:90px;*/
	min-height: 90px;
	width: 100%;
	line-height: 1.4;
	text-decoration:none;
	background-color:#fff;
	max-width:420px;
	margin:0 auto 20px;
	border:1px solid #cf4246;
}
.box-gray .link-btnL a,
.contact-area .link-btnL a{border: 1px solid #fff;}
html:not(.mobile) .box-gray .overSlide:hover{border: 1px solid #000!important;}
html:not(.mobile) .contact-area .overSlide:hover{border: 1px solid #fff!important;}
.link-btnL a>span{
	width: 100%;
	position: absolute;
	top: 50%;
	left:50%;
	transform: translate(-50%, -50%);
}
.link-btnL .textS{
	font-size:14px;
	vertical-align:2.5%;
}
.link-btnL img.imgIcon.blank{vertical-align:2px;}

.link-btnL.revers a{
	color: #fff;
	font-size:16px;
	background-color:#000;
	border:1px solid #fff;
	max-width:320px;
	min-height: 60px;
}
.link-btnL.revers img.imgIcon.blank{vertical-align:0px;}

/*=============================================================
 box
=============================================================*/
[class^="box-"]>*:first-child{margin-top:0;}

/* box-full
-------------------------------------------------------------*/
.box-full{
	background:#000;
	margin-right:calc(50% - 50vw);
	margin-left:calc(50% - 50vw);
	padding-right:calc(50vw - 50%);
	padding-left:calc(50vw - 50%);
	position: relative;
}
.box-full.arrow{background:#cf4246;}
.box-full.arrow::before{
	content: '';
	position: absolute;
	top:0;
	left:50%;
	width: 0;
  height: 0;
  border-left: 40px solid transparent;
  border-right: 40px solid transparent;
  border-top: 40px solid #f0f0f0;
	transform: translateX(-50%);
}
.box-full.arrow.arrow-w::before{border-top: 40px solid #fff;}

/* box-fullW */
.box-fullW{
	background:#000;
	margin-right:calc(50% - 50vw);
	margin-left:calc(50% - 50vw);
}

/* box-normal
-------------------------------------------------------------*/
.box-normal{
	background: #fff;
	padding: 80px 20px;
	box-sizing: border-box;
}
.box-normal>*{
	max-width: 1128px;
	margin: 0 auto;
}
/* box-gray
-------------------------------------------------------------*/
.box-gray{
	background: #f0f0f0;
	padding: 80px 20px;
	box-sizing: border-box;
}
.box-gray>*{
	max-width: 1128px;
	margin: 0 auto;
}
/* box-white
-------------------------------------------------------------*/
.box-white{
	background: #fff;
	padding: 60px 80px 100px;
	box-sizing: border-box;
}
.box-white>*{
	max-width: 1128px;
	margin: 0 auto;
}
.box-white + .box-white{
	margin-top: 100px;
} 
/* box-black
-------------------------------------------------------------*/
.box-black{
	color: #fff;
	padding: 100px 20px 80px;
	box-sizing: border-box;
}
.box-black>*{
	max-width: 920px;
	margin: 0 auto;
}

/* link-box
-------------------------------------------------------------*/
.link-box{
	max-width: 920px;
	margin: 0 auto;
	padding: 110px 0 70px;
}

/*=============================================================
 col
=============================================================*/
.col-2,.col-3,.col-4,.col-5,.col-6{
	display:flex;
	flex-wrap:wrap; 
}
.col-2>*,.col-3>*,.col-4>*,.col-5>*,.col-6>*{
	box-sizing:border-box;
	margin-top:20px;
	margin-left:20px;
}
.col-2>*{width:calc((99.9999% - 20px) / 2);}
.col-3>*{width:calc((99.9999% - 40px) / 3);}
.col-4>*{width:calc((99.9999% - 60px) / 4);}
.col-2>*:nth-child(2n+1),
.col-3>*:nth-child(3n+1),
.col-4>*:nth-child(4n+1){margin-left:0;}
.col-2>*:nth-child(-n+2),
.col-3>*:nth-child(-n+3),
.col-4>*:nth-child(-n+4){margin-top:0;}

/*=============================================================
 list
=============================================================*/
[class^="list-"] [class^="list-"]{margin-top:0.6em;}

/* list-circle
-------------------------------------------------------------*/
.list-circle{
	line-height:1.4;
	margin-top:20px;
}
.list-circle>li{
	padding-left:1em;
	margin-top:0.6em;
	position:relative;
}
.list-circle>li::before{
	content:"";
	background:#000;
	display:block;
	width:0.8em;
	height:0.8em;
	border-radius:100%;
	position:absolute;
	top:0.25em;
	left:0;
}
/* list-dot
-------------------------------------------------------------*/
.list-dot{
	line-height:1.4;
}
.list-dot>li{
	text-indent:0;
	padding-left:1em;
	position:relative;
}
.list-dot>li::before{
	content:"";
	background:#000;
	display:block;
	width:4px;
	height:4px;
	margin-top:-6px;
	border-radius:100%;
	position:absolute;
	top:0.8em;
	left:0.2em;
}
/*=============================================================
 pageTtlMain
=============================================================*/
#pageTtlMain{
  width: 100vw;
  margin: 0 ;
  overflow: hidden;
	position: relative;
}
#pageTtlMain .main-logo{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%,-50%);
	z-index: 2;
}
#pageTtlMain .slideL {
	position: relative;
	width: 100%;
	height: 336px;
	background-image: url('../img/main_p01.jpg');
	background-repeat: repeat-x;
	background-size: cover;
	background-position: 0 0;
	animation-name: slide_imgL;
	animation-duration: 200s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	margin-bottom: 5px;
}
@keyframes slide_imgL {100% {background-position: 5000px 0;}}

#pageTtlMain .slideR {
	position: relative;
	width: 100%;
	height: 336px;
	background-image: url('../img/main_p02.jpg');
	background-repeat: repeat-x;
	background-size: cover;
	background-position: 0 0;
	animation-name: slide_imgR;
	animation-duration: 200s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}	
@keyframes slide_imgR {100% {background-position: -5000px 0;}}

#pageTtlMain .slideL-sp{
	display: none;
	position: relative;
	width: 100%;
	height: 250px;
	background-image: url('../img/main_p03_sp.jpg');
	background-repeat: repeat-x;
	background-size: cover;
	background-position: 0 0;
	animation-name: slide_imgL-sp;
	animation-duration: 200s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	margin-bottom: 5px;
}
@keyframes slide_imgL-sp {100% {background-position: 5000px 0;}}

/*=============================================================
 solution-area
=============================================================*/
.solution-area .solution-item h2{
	font-size: 24px;
	color: #882d34;
	font-style: italic;
	text-align: center;
	border-bottom: 1px solid #000;
}
.solution-area .solution-item.item-color h2{color: #004963;}
.solution-area .solution-item h2 strong{
	font-size: 42px;
}
.solution-area .solution-item h3{
	text-align: center;
	font-size: 32px;
	line-height: 1.4;
	margin: 40px 0 38px;
}
.solution-area .solution-item .ttl-request{
	text-align: center;
	font-size: 22px;
	font-weight: 700;
	color: #882d34;
	margin: 40px 0 30px;
}
.solution-area .solution-item.item-color .ttl-request{color: #004963;}
.solution-area .solution-item .solution-mw{
	max-width: 640px;
	margin: 0 auto;
}
.solution-area .solution-item .solution-list{
	font-size: 18px;
}
.solution-area .solution-item02 .catch{
	font-size: calc(24px + ((1vw - 7.68px) * 4.36893));
	position: relative;
	border-top: 1px solid #000;
	padding: 60px 0 10px;
	margin: 50px 0 40px;
}
.solution-area .solution-item02 .catch::before{
	content: "";
	border:40px solid transparent;
	border-top-color:#fff;
	border-bottom-width:0;
	top:9px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
	z-index:1;
	margin-top: -10px;
	transform: translateX(-50%);
}
.solution-area .solution-item02 .catch::after{
	content: "";
	border:40px solid transparent;
	border-top-color:#000;
	border-bottom-width:0;
	top:10px;
	content:"";
	display:block;
	left:50%;
	position:absolute;
	width:0;
	margin-top: -10px;
	transform: translateX(-50%);
}
.catch + .box-white{margin-top: 80px;}
@media screen and (min-width:1128px) {
.solution-area .solution-item02 .catch{font-size: 44px;}
}

/* point-area
--------------------------------------------------------------*/
.solution-area .solution-item02 .point-area{
	max-width: 678px;
	margin: 0 auto;
}
.solution-area .solution-item.item-color .solution-item02 .point-area{max-width: none;}
.solution-area .solution-item02 .point-area h4{
	color: #882d34;
	font-size: 36px;
	font-style: italic;
	font-weight: normal;
	text-align: center;
	position: relative;
	padding-bottom: 10px;
	margin-bottom: 30px;
}
.solution-area .solution-item02 .point-area h4:after{
	content: '';
	position: absolute;
	bottom:0;
	left:50%;
	transform: translateX(-50%);
	width: 30px;
	height: 1px;
	background: #000;
}
.solution-area .solution-item.item-color .solution-item02 .point-area h4{color: #004963;}

.solution-area .point-area figure{position: relative;}
.solution-area .point-area .col-item{
	position: relative;
	background: #fff;
	z-index: 1;
	max-width: 270px;
	margin: 0 auto -36px;
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
}
.solution-area .point-area .col-3.pd40 .col-item{padding: 20px 20px 40px;}

.solution-area .point-area .point-text{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	height: 100%;
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	z-index: 2;
}
.solution-area .point-area .point-text h5{
	font-size: 22px;
	font-weight: normal;
	font-style: italic;
	margin-bottom: 5px;
}
.solution-area .point-area .point-text h5.mh2L{
	min-height: 60px;
}
.solution-area .point-area .point-text p{text-align: left;}


/*=============================================================
 threeValues-area
=============================================================*/
.threeValues-area .col-3{
	max-width: 960px;
	margin: 60px auto 0;
}
.threeValues-area .col-3 figure{}
.threeValues-area .col-3 figcaption{margin-top: 20px;}

/*=============================================================
example-area
=============================================================*/
.example-area .ttl-example{
	position: relative;
	text-align: center;
	font-size: 24px;
	font-weight: normal;
	margin-top: 60px;
	border-bottom: 1px solid #000;
}
.example-area .ttl-example>span{
	display: block;
	width: 100%;
	position: absolute;
	bottom:10px;
}
.example-area .item{
	max-width: 986px;
	margin: 0 auto;
}
.example-area .col-3{margin-top: 30px;}
.example-area .col-3>li>*{margin-bottom: 10px;}
.example-area .ttl-example-name{
	margin-top: 30px;
	font-size: 18px;
}
.example-area .mh2L .ttl-example-name{min-height: 2.8em;}
.example-area .mh3L .ttl-example-name{min-height: 4.2em;}
.example-area .icon-flow{
	display: flex;
	width: 100%;
}
.example-area .icon-flow>li{
	text-align: center;
	padding: 0 5px;
	box-sizing: border-box;
	flex: 1 1 auto;
}
.example-area .icon-flow>li>span{
	color:#595959;
	display: block;
	padding: 5px 0;
	background: #e7d5d6;
}
.example-area .item-color .icon-flow>li>span{background: #ccdbe0;}

.example-area .example-btn{padding: 110px 0 0;}
.example-area .example-btn a {
	font-size: 18px;
	font-weight: normal;
	background-color: #f0f0f0;
	border: 1px solid #f0f0f0;
}

/*=============================================================
support-area
=============================================================*/
.support-area .ttl-support{
	text-align: center;
	font-size: 22px;
	font-weight: 700;
	margin: 90px auto 20px;
}

/*=============================================================
pay-area
=============================================================*/
.pay-area .col-2{
	max-width: 920px;
	margin: 90px auto 0;
}
.pay-area .col-2 figure{
	text-align: center;
	margin-bottom: 50px;
}
.pay-area .col-2>*{
	font-size: 20px;
	line-height: 1.5;
}
.pay-area .col-2>* .text-pay{
	border-top: 1px solid #000;
	padding-top: 30px;
}
.pay-area .col-2>* a.linktext{
	color: #000;
	border-bottom: 1px solid #000;
}
.pay-area .col-2>* a.linktext:hover{text-decoration: none;opacity: 0.6;}


/*=============================================================
contact-area
=============================================================*/
.contact-area .catch + .lead{margin-top: 36px;}




/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:767px), only screen and (max-device-width:767px){

/*=============================================================
 base Layout
=============================================================*/
/* container
--------------------------------------------------------------*/
#container{min-width:320px;}
body,
#container{}	
	
/* pageBody
--------------------------------------------------------------*/
#pageBody{}

/* contentsInner
-------------------------------------------------------------*/
.contentsInner{padding:0 4%;}

/* contents
-------------------------------------------------------------*/
#contents{
	margin-top:0px;
	padding-bottom:0;
}

/* section
-------------------------------------------------------------*/
section + section{}

/*=============================================================
 text
=============================================================*/
/* h2
--------------------------------------------------------------*/

/* catch
--------------------------------------------------------------*/
.catch{font-size: 25px;}
.catch + .box-white{margin-top: 30px;}
	
/* lead
--------------------------------------------------------------*/
.lead{font-size: 16px;}
.catch + .lead{margin-top: 20px;}
	
/*=============================================================
 link
=============================================================*/

/* link-btn */
.link-btn:not(ul),
.link-btn>li{
	display:block;
	width:auto !important;
	max-width:300px;
	margin-right:auto !important;
	margin-left:auto !important;
}
.w-clm2.link-btn:not(ul),
.w-clm2.link-btn>li{max-width:465px;}
.w-clm2-2.link-btn:not(ul),
.w-clm2-2.link-btn>li{max-width:630px;}
.clm.link-btn>li{float:none;}

/* link-btnL */
.link-btnL{margin-top:60px;}
.link-btnL a{
	font-size:14px;
	line-height:58px;
	width:auto;
	min-height: 80px;
}
.link-btnL>li{margin-top: 10px!important;}
.link-btnL .textS{font-size:12px;}
.link-btnL img.imgIcon.blank{vertical-align:0;}

/* imgIconCart */
img.imgIconCart,
img.imgIconMail,
img.imgIconCatalog,
img.imgIconOffice{vertical-align:-8px;}



	
/*=============================================================
 box
=============================================================*/
/* box-full
-------------------------------------------------------------*/
.box-full,
.sp-box-full{
	margin-right:-4.4%;
	margin-left:-4.4%;
	padding-right:4%;
	padding-left:4%;
}
.contentsInner.sp-box-full{
	margin-right:0;
	margin-left:0;
	padding-right:0;
	padding-left:0;
}
	
.box-full.arrow.arrow-w::before{border-top: 40px solid #fff;}	
	
/* box-fullW */
.box-fullW,
.sp-box-fullW{
	margin-right:-4%;
	margin-left:-4%;
	padding-right:0;
	padding-left:0;
}
	
/* box-normal
-------------------------------------------------------------*/
.box-normal{
	background: #fff;
	padding: 40px 20px;
	box-sizing: border-box;
}
.box-normal>*{max-width: none;}
	
/* box-gray
-------------------------------------------------------------*/
.box-gray{padding: 45px 20px;}
.box-gray>*{max-width: none;}
	
/* box-white
-------------------------------------------------------------*/
.box-white{padding: 30px 20px 70px;}
.box-white>*{max-width: none;}
.box-white + .box-white{margin-top: 60px;} 
	
/* box-black
-------------------------------------------------------------*/
.box-black{padding: 30px 20px 70px;}
.box-black>*{max-width: none;}

/* link-box
-------------------------------------------------------------*/
.link-box{
	max-width: none;
	margin: 0 auto;
	padding: 70px 0 50px;
}	
/*=============================================================
 col
=============================================================*/
.col-2>*:nth-child(n),.col-3>*:nth-child(n),.col-4>*:nth-child(n),.col-5>*:nth-child(n),.col-6>*:nth-child(n){
	width:100%;
	margin-left:0;
}
.col-2>*:nth-child(n+2),
.col-3>*:nth-child(n+2),
.col-4>*:nth-child(n+2){margin-top:15px;}

.sp-col-2>*:nth-child(n){width:calc((99.9999% - 15px) / 2);}
.sp-col-3>*:nth-child(n){width:calc((99.9999% - 30px) / 3);}
.sp-col-4>*:nth-child(n){width:calc((99.9999% - 45px) / 4);}

.sp-col-2>*:nth-child(n),
.sp-col-3>*:nth-child(n),
.sp-col-4>*:nth-child(n){
	margin-top:15px;
	margin-left:15px;
}
.sp-col-2>*:nth-child(2n+1),
.sp-col-3>*:nth-child(3n+1),
.sp-col-4>*:nth-child(4n+1){margin-left:0;}
.sp-col-2>*:nth-child(-n+2),
.sp-col-3>*:nth-child(-n+3),
.sp-col-4>*:nth-child(-n+4){margin-top:0;}

/*=============================================================
 pageTtlMain
=============================================================*/
#pageTtlMain{}
#pageTtlMain .main-logo img{max-width: 300px;}
#pageTtlMain .slideL {
	height: 160px;
	background-image: url('../img/main_p02_sp.jpg');
}
#pageTtlMain .slideR {
	height: 160px;
	background-image: url('../img/main_p03_sp.jpg');
	margin-bottom: 5px;
}	
#pageTtlMain .slideL-sp{
	display: block;
	height: 160px;
	background-image: url('../img/main_p01_sp.jpg');
	margin-bottom: 0;
}
	
	
/*=============================================================
 solution-area
=============================================================*/
.solution-area .solution-item h2{font-size: 14px;}
.solution-area .solution-item h2 strong{font-size: 30px;}
.solution-area .solution-item h3{
	font-size: 18px;
	margin: 20px 0;
}
.solution-area .solution-item .ttl-request{
	font-size: 18px;
	margin: 20px 0;
}
.solution-area .solution-item .solution-mw{max-width: none;}
.solution-area .solution-item .solution-list{font-size: 14px;}
.solution-area .solution-item02 .catch{
	font-size: 22px;
	padding: 50px 0 10px;
	margin: 30px 0 30px;
}
.solution-area .solution-item02 .catch::before{
	border:30px solid transparent;
	border-top-color:#fff;
	border-bottom-width:0;
}
.solution-area .solution-item02 .catch::after{
	border:30px solid transparent;
	border-top-color:#000;
	border-bottom-width:0;
}

/* point-area
--------------------------------------------------------------*/
.solution-area .solution-item02 .point-area,
.solution-area .solution-item.item-color .solution-item02 .point-area{max-width: 240px;}	
.solution-area .solution-item02 .point-area h4{
	font-size: 20px;
	margin-bottom: 20px;
}
.solution-area .solution-item02 .point-area h4:after{width: 20px;}
.solution-area .point-area .col-item{
	max-width: 190px;
	padding: 10px;
}
.solution-area .point-area .col-3.pd40 .col-item{padding: 10px;}		
.solution-area .point-area .point-text{
	font-size: 12px;
	line-height: 1.5;
	padding: 10px;
}
.solution-area .point-area .col-item figure img{height: 80px;}
.solution-area .point-area .point-text h5{font-size: 16px;}
.solution-area .point-area .point-text h5.mh2L{min-height:inherit;}

/*=============================================================
 threeValues-area
=============================================================*/
.threeValues-area .col-3{
	max-width: none;
	font-size: 12px;
	margin: 20px auto 0;
}
.threeValues-area .col-3 figure{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}
.threeValues-area .col-3 figure img{
	max-width: 160px;
	height: auto;
}	
.threeValues-area .col-3 figcaption{
	margin-top: 0;
	margin-left: 10px;
	width: calc((100% - 170px));
}

/*=============================================================
example-area
=============================================================*/
.example-area .ttl-example{
	font-size: 18px;
	margin-top: 30px;
}
.example-area .item{max-width: none;}
.example-area .col-3{margin-top: 20px;}
.example-area .col-3>li>figure{
	display: inline-block;
	width: calc((100% - 17px) / 2);
}
.example-area .col-3>li>figure:first-child{margin-right: 8px;}	
.example-area .col-3>li>*{margin-bottom: 14px;}

.example-area .ttl-example-name{
	margin-top: 0;
	font-size: 18px;
}
.example-area .mh2L .ttl-example-name,.example-area .mh3L .ttl-example-name{min-height:inherit;}
.example-area .icon-flow{
	font-size: 10px;
	/*width: 60%;*/
}
.example-area .icon-flow>li {padding: 0 3px;}		
.example-area .icon-flow>li>span{padding: 3px 0;}
.example-area .example-btn{padding: 50px 0 0;}
.example-area .example-btn a {font-size: 13px;}

/*=============================================================
product-area 
=============================================================*/
.product-area .link-box{padding: 20px 0 0;}
	
/*=============================================================
support-area
=============================================================*/
.support-area .ttl-support{
	font-size: 14px;
	margin: 30px auto 20px;
}
.support-area .img-scroll-box{
	display:flex;
	align-items: flex-end;
}
.support-area .img-scroll-box img{max-width: none;}	
.support-area .img-scroll{
	width: 100%;
	overflow-x: scroll;
	white-space: nowrap;
  overflow-scrolling: touch;
  -webkit-overflow-scrolling: touch;
	position: relative;
}	
.support-area .img-scroll span{display: block;}	

	
/*=============================================================
pay-area
=============================================================*/
.pay-area .col-2{
	max-width: none;
	margin: 40px auto 0;
}
.pay-area .col-2 figure{
	max-width: 280px;
	margin: 0 auto 40px;
}
.pay-area .col-2>*{
	font-size: 17px;
	line-height: 1.6;
}
.pay-area .col-2>div + div{margin-top: 60px;}	
.pay-area .col-2>* .text-pay{padding-top: 20px;}
.pay-area .col-2>* .link-btnL{margin-top: 20px;}


/*=============================================================
contact-area
=============================================================*/
.contact-area .catch + .lead{margin-top: 36px;}
.contact-area .link-box {padding: 30px 0 0;}
.contact-area .link-btnL.revers{
	margin: 0 auto;
	max-width: 240px;
}
.contact-area .link-btnL.revers>li{margin-top: 0;}	
.contact-area .link-btnL.revers>li a{
	min-height: 40px;
	font-size: 14px;
}	
}