@charset "utf-8";


.caseindex section ul.list-thumb{ margin-bottom:60px;}
.caseindex #contents h3{ margin-bottom:10px;}


.deta{ display:block;}
.deta span.client{ display:inline-block; padding-right:1em;}
.deta span.place{ display:inline-block;}


/*slider*/
.case.entry .swiper-slide img{ width:100%; height:auto;}
.case.entry .swiper-slide .textArea{ display:block; width:100%; background:rgba(255,255,255,0.6); height:auto; position:absolute; left:0; bottom:0;}
.case.entry .swiper-slide .textArea p{ text-align:center; line-height:1.4em; padding:0.8em 20px; margin-bottom:0;}


.thumbnails li{ width:132px; display:block; margin-right:10px; float:left; position:relative;}

.thumbnails li.act:before{ content:""; width:100%; height:100%; border:2px solid #0052A6; box-sizing:border-box; display:block; position:absolute; left:0; top:0;}

.thumbnails li:last-child{ margin-right:0;}
.thumbnails li a{ display:block;}
.thumbnails li a img{ width:100%; height:auto; }

.case.entry .slider{ margin-bottom:10px;}
.case.entry .slider .pager {	position:absolute;	top: 0;	width: 100%; height:100%;}
.case.entry .slider .next, .case.entry .slider .prev {position: absolute; top: 50%;  -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 30px; height:50px; z-index: 100;}
.case.entry .slider .prev {left: 10px;}
.case.entry .slider .next {right: 10px;}
.case.entry .slider .next, .case.entry .slider .prev {
	-webkit-transition: all .2s cubic-bezier(.165, .84, .44, 1); transition: all .2s cubic-bezier(.165, .84, .44, 1);
	-webkit-box-sizing: border-box;	box-sizing: border-box; 
	overflow: hidden; display: block; position:absolute; backface-visibility: hidden; width: 30px; height:50px;
}
.case.entry .slider .next::after, .case.entry .slider .prev::after { display: none; }

.case.entry .slider .next img, .case.entry .slider .prev img {
	width: 20px; height:auto; position:absolute;
	-webkit-transition: all .2s cubic-bezier(.165, .84, .44, 1);
	transition: all .2s cubic-bezier(.165, .84, .44, 1);
}

.case.entry #contents .pagetitle .category{ display:inline-block; margin-top:1em;}
.case.entry #contents .pagetitle time{ display:block;}

.case.entry .slider .next img{ left:0; top:0;}
.case.entry .slider .prev img{ right:0; top:0;}
.case.entry .slider .next:hover img { left:5px; }
.case.entry .slider .prev:hover img { right:5px;}
.case.entry .swiper-pagination-bullet {  width: 15px;  height: 15px;  display: inline-block;  border-radius: 100%;  background: #fff;}
.case.entry #slider{ display:block; margin-bottom:60px;}

.case.entry section .sectionTit{ display:block; width:540px; margin:0 auto 60px; position:relative; text-align:center;}
.case.entry section .sectionTit span{ display:inline-block; position:relative; padding:0 50px; font-size:20px; font-weight:bold; line-height:2em; margin-top: 40px;}
.case.entry section .sectionTit span:before{ content:""; position:absolute; left:0; top:0; width:1px; height:40px; background:#000000;
transform: rotate(-15deg);-moz-transform: rotate(-15deg);-webkit-transform: rotate(-15deg);}
.case.entry section .sectionTit span:after{ content:""; position:absolute; right:0; top:0; width:1px; height:40px; background:#000000;
transform: rotate(15deg);-moz-transform: rotate(15deg);
-webkit-transform: rotate(15deg);}

.case.entry section .sectionTit.point:before{ content:""; width:80px; height:100px; display:block; position:absolute; left:0; top:0; background:url(../reform/img/c-point-left.png) no-repeat; background-size:80px;}
.case.entry section .sectionTit.point:after{ content:""; width:80px; height:100px; display:block; position:absolute; right:0; top:0; background:url(../reform/img/c-point-right.png) no-repeat; background-size:80px;}

.case.entry section .sectionTit.kansou:before{ content:""; width:80px; height:100px; display:block; position:absolute; left:0; top:0; background:url(../reform/img/c-kansou-left.png) no-repeat; background-size:80px;}
.case.entry section .sectionTit.kansou:after{ content:""; width:80px; height:100px; display:block; position:absolute; right:0; top:0; background:url(../reform/img/c-kansou-right.png) no-repeat; background-size:80px;}


.case.entry section .sectionTit.ba:before{ content:""; width:80px; height:100px; display:block; position:absolute; left:0; top:0; background:url(../reform/img/c-ba-left.png) no-repeat; background-size:80px;}
.case.entry section .sectionTit.ba:after{ content:""; width:80px; height:100px; display:block; position:absolute; right:0; top:0; background:url(../reform/img/c-ba-right.png) no-repeat; background-size:80px;}

/*.case.entry #contents section .kansouArea{ padding-left:80px;}*/
.case.entry #contents section .kansouArea h2{ background:none; padding:0; margin-left: 80px;}
.case.entry #contents section .kansouArea h2 span{ width:620px; display:block; border-radius:30px; min-height:60px; margin-bottom:20px; font-size:16px; padding:12px 20px; position:relative;}
.case.entry #contents section .kansouArea h2 div.tit-q span{background:#0053A7; border:1px solid #0053A7; color:#FFFFFF; margin-bottom:20px; }
.case.entry #contents section .kansouArea h2 div.tit-a span{background:#fff; border:1px solid #0053A7; color:#0053A7;}
.case.entry #contents section .kansouArea h2 > div{ position:relative;}
.case.entry #contents section .kansouArea h2 > div:before{content:""; width:10px; height:10px; display:block; background:#0053A7; position:absolute; left:-3px; top:25px;-moz-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-o-transform: rotate(-45deg);-ms-transform: rotate(-45deg);}
.case.entry #contents section .kansouArea h2 div.tit-q span:before{ content:""; width:60px; height:60px; display:block; border:1px solid #0053A7; box-sizing:border-box; background:url(../reform/img/icon_customer.png) no-repeat; background-size:cover; border-radius:30px; position:absolute; left:-80px; top:0;}

.case.entry #contents section .beforeafter{ margin-bottom:30px;}
.case.entry #contents section .beforeafter h3{ clear:both; padding-top:20px; margin-bottom:10px;}
.case.entry #contents section .beforeafter .column2.before:before{ content:"Before"; width:6em; color:#FFF; text-align:center; padding:5px 0; font-size:14px; display:block; background: url(../img/pattern_dot.png)#0053A7; position:absolute; left:0; top:0;     font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    font-style: italic;
    font-size: 15px;}
.case.entry #contents section .beforeafter .column2.after:before{ content:"After"; width:6em; color:#FFF; text-align:center; padding:5px 0; font-size:14px; display:block; background: url(../img/pattern_dot.png)#F7575B; position:absolute; left:0; top:0;     font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    font-style: italic;
    font-size: 15px;}

.case.entry #contents .box.blueBox.light .columnWrap .column2 dl.dlTable>dt{ width:50%;}
.case.entry #contents .box.blueBox.light .columnWrap .column2 dl.dlTable>dd{ margin-left:50%;}


.case.entry #contents .innerWrap .entryNav{ margin-bottom:60px;}

@media screen and (max-width:1460px){
}

@media screen and (max-width:1176px){
}

@media screen and (max-width:767px){
	
	.thumbnails li{ width:19.2%; display:block; margin-right:1%; float:left; position:relative;}
	.thumbnails li:last-child{ margin-right:0;}
	.case.entry .slider .next img, .case.entry .slider .prev img { width:10px;}
	.case.entry .slider .next, .case.entry .slider .prev {width: 15px; height:25px;}
	.case.entry .swiper-slide .textArea{ display:block; width:100%; background:rgba(255,255,255,0.6); height:auto; position:absolute; left:0; bottom:0;}
	.case.entry .swiper-slide .textArea p{ text-align:center; line-height:1.2em; padding:0.2em 10px; margin-bottom:0; font-size:0.9rem;}
	
	.case.entry section .sectionTit{ display:block; width:auto; margin:0 auto 20px; padding:0 50px 0; position:relative; text-align:center;}
	.case.entry section .sectionTit span{ padding:0 10px ; font-size:16px; margin-top:10px;}
	.case.entry section .sectionTit.point:before{ content:""; width:40px; height:50px; display:block; position:absolute; left:0; top:0; background:url(../reform/img/c-point-left.png) no-repeat; background-size:40px;}
.case.entry section .sectionTit.point:after{ content:""; width:40px; height:50px; display:block; position:absolute; right:0; top:0; background:url(../reform/img/c-point-right.png) no-repeat; background-size:40px;}

.case.entry section .sectionTit.kansou:before{ content:""; width:40px; height:50px; display:block; position:absolute; left:0; top:0; background:url(../reform/img/c-kansou-left.png) no-repeat; background-size:40px;}
.case.entry section .sectionTit.kansou:after{ content:""; width:40px; height:50px; display:block; position:absolute; right:0; top:0; background:url(../reform/img/c-kansou-right.png) no-repeat; background-size:40px;}


.case.entry section .sectionTit.ba:before{ content:"";width:40px; height:50px; display:block; position:absolute; left:0; top:0; background:url(../reform/img/c-ba-left.png) no-repeat; background-size:40px;}
.case.entry section .sectionTit.ba:after{ content:"";width:40px; height:50px; display:block; position:absolute; right:0; top:0; background:url(../reform/img/c-ba-right.png) no-repeat; background-size:40px;}

.case.entry #contents section .kansouArea{ /*padding-left:50px;*/}
.case.entry #contents section .kansouArea h2 span{ width:auto;}
.case.entry #contents section .kansouArea h2 div.tit-q span:before{ width:40px; height:40px; left:-50px;}

.case.entry #contents .box.blueBox.light .columnWrap .column2{margin-bottom:0!important;}
.case.entry #contents .box.blueBox.light .columnWrap .column2 dl.dlTable>dt{ width:auto;}
.case.entry #contents .box.blueBox.light .columnWrap .column2 dl.dlTable>dd{ margin-left:0;}
.case.entry #contents .box.blueBox.light .columnWrap .column2:last-child{ margin-bottom:30px!important;}
.case.entry #contents .box.blueBox.light h3{ margin-top:30px;}
.case.entry #contents .box.blueBox.light > h3{ margin-top:10px;}

.case.entry #contents section .beforeafter .column2.before:before{ content:"Before"; width:4em; color:#FFF; text-align:center; padding:5px 0; font-size:12px; display:block; background: url(../img/pattern_dot.png)#0053A7; position:absolute; left:0; top:0;     font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    font-style: italic; box-sizing:border-box;
}
.case.entry #contents section .beforeafter .column2.after:before{ content:"After"; width:4em; color:#FFF; text-align:center; padding:5px 0; font-size:12px; display:block; background: url(../img/pattern_dot.png)#F7575B; position:absolute; left:0; top:0;     font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    font-style: italic; box-sizing:border-box;
}

.case.entry #contents .innerWrap .entryNav{ margin-bottom:20px;}

}