/*----CONTENTS layout------*/
/*----[A]共通----*/
div.layer_contents { padding: 0; margin: 0; background: rgba(255,255,255,1);}

/*----(1) 全面設定----*/
ul.no-screen {display: block;padding: 0;list-style: none;}
ul.no-screen li {}
/*--(2) TOPと中のページは共通--*/
ul.no-screen li div.contents {padding: 0;position: relative;  border-top: 1px solid #bbb;}

/*----(1) 2面設定 WIDTH----*/
ul.screen {display: table;list-style: none; background: transparent;}
ul.screen li {display: table-cell;vertical-align: top;}
ul.screen li.side1 { width: 30%; padding: 0;}
ul.screen li.side2 { width: 70%; padding: 0;}
.side-a {background-image: linear-gradient(90deg,rgba(0,0,0,0) 0%, #fff 100%);}
.side-b {background: #fff;}
/*-- (2) 2面 TOP --*/
.contents-left {padding: 0;}
.contents-right {padding: 0;}
/*-- (2) 2面 中のページ --*/
ul.screen li div.contents {padding: 0; margin: 0;position: relative;}
ul.screen li.side1 div.contents { }
ul.screen li.side2 div.contents { }

/*--- [B](2) CONTENTS-TOP 全面 または 2面 TOP 中のページ ---*/
ul.no-screen li div.contents-top,ul.screen li.side1 div.contents-top,ul.screen li.side2 div.contents-top  { padding-top: 14px; border: none;}

/*----CAPTION----*/
div.caption { color: #FF54A1; font-size: 15px; line-height: 24px; border: 0;background-image: linear-gradient(180deg, rgba(0,0,0,0.058) 0%, rgba(0,0,0,0.0) 100%); margin: 0 1px; padding: 10px 20px 10px 20px;}
div.caption span {display: block;}
div.caption span.sub-caption-1{font-size:16px;}
div.caption span.sub-caption{font-size:18px; color: #FF6666; margin:7px 50px 5px 0;}

/*----fold----*/
div.fold {padding: 0 30px 18px 20px;margin: 0;font-size: 16px;color: #717272;line-height: 27px; display: inline-block;}
div.fold span { display:block; color:#D54889;}
div.fold a { color: #65757B; border-bottom: 1px dotted #FBB6B6;}
div.fold a:hover { color:#3F9DF7;}

/*--自動UL--*/
div.fold ul {display: block;list-style: square;color: deeppink;margin: 0 0 0 24px;padding: 0;}
div.fold ul li {display: list-item;color: deeppink;border: 0;padding-top: 3px;margin-bottom: 3px;}
div.fold ul li span {display: block;color: #304646;}

/*-----absolute用-----*/
.open-fold,.close-fold {
outline:none;
position: absolute;
top: 20px;
left: 0;
z-index: 999;
width: 100%;
background: transparent;
border: 0;
text-align: right;
padding-right: 12px;
cursor: pointer;
}

.open-fold {
display:block;
color: #417038;
margin:1px 0 0 0;
}

.close-fold {
display:inline-block;
color: #339900;
margin:1px 0 0 0;
}

/*-----ICON------*/

.i-top-r {
color: #FF3300;
margin-right: 5px;
}

.i-top-b {
color: #9CBAEB;
margin-right: 5px;
}

.i-top-g {
color: #00CC33;
margin-right: 5px;
}

.i-top-p {
color: deeppink;
margin-right: 5px;
}

section.concept { display: block; position: relative; height: 253px; padding: 0 0 0 455px; margin-left: -15px; letter-spacing: 1px; }
section.concept img { position: absolute; top:0; left: 0; width: 355px;}
section.concept h4 { font-size: 23px; padding: 11px 0 0 0; margin: 0 0 20px 0; font-weight: bold;}
.green { color: rgba(50,190,0,0.42);}
.orange { color: rgba(180,150,5,0.42);}
.pink { color: rgba(230,5,100,0.42);}
section.concept h2 { position: relative; margin: 4px 20px 15px 0; padding: 0; top: 0; left: 0; font-size: 19px; color: #555;}
section.concept h3 {display:block; padding: 2px 0 10px 0; margin: 0;}
section.concept p {}

/*---------------*/
section.concept button::before {content:'▼';color:#fff; display: inline-block; transform:rotate(-90deg);position:absolute; left:7px; top:20%;}
section.concept button::after {content:'詳細はこちら';color:#16562a; display: inline-block; width: 170px;position:absolute; left:0; top:9%;  font-size: 16px;}
section.concept button {position:absolute; bottom: 5px; left: 85%; display:  block; width: 25px; height: 25px; background: rgb(9, 157, 27); transition: all .4s ease-in-out; border-radius: 100px; text-decoration: none;text-align: center; border: none; margin: 0 0 10px 0;}

section.concept button:hover::before { }
section.concept button:hover::after {color:#fff;}
section.concept button:hover {width: 150px;}