@charset "utf-8";

.sec01{
	margin-top:20px;
}

.sec01 .detail{
	margin-bottom:110px;
}

.detail {
	max-width: 800px;
	margin:0 auto;
}
.detail .ttl {
	position: relative;
}
.detail .ttl::after {
	content: url(../images/work/ttl_bg01.png);
	position: absolute;
	left: -20px;
	top: -20px;
	z-index: -1;
	height: auto;
	visibility: visible;
}
/*
.txt_wrap {
	display: flex;
}

.txt_wrap > * {
	margin: 0 auto;
	width: 50%;
}
.txt_wrap .txt{
	font-size: 14px;
}
*/

.sec01{
	margin-bottom:150px;
}

.illust{
	margin:0 auto;
}

.illust.i01{
	max-width:700px;
	margin-bottom:110px;
}

.illust li{
	float:left;
}

.illust li:nth-child(2){
	float:right;
}


.illust.i01 li{
	margin-bottom:30px;
}

.illust.i01 li .i_txt{
	font-size:12px;
	padding-left:25px;
}

.illust.i01 li:nth-child(2n){
	float:right;
}

.illust.i01 li:nth-child(2n+1){
	clear:both;
}


.illust.i01 li{
	width:48.58%;
}
	



.illust.i02{
	max-width:800px;
	margin-bottom:30px;
}

.illust.i02 li{
	width:48.875%;
}

.anno{
	font-size:12px;
	color:#6A5051;
}

.sec01 .anno{
	margin-bottom:0;
}



.illust.i03{
	max-width:770px;
	margin-bottom:20px;
}

.illust.i03 li{
	width:48.06%;
}

.sec02{
	margin-bottom:170px;
}

.sec02 .anno a{
	text-decoration:underline;
}


.sec03{
	/*margin-bottom:80px;*/
	padding-bottom:120px;
}


.inter_bg:before {
	left: 34%;
}


.q_ttl{
    max-width: 830px;
    margin: 0 auto;
    padding-left: 60px;
}

.q_ttl li:nth-child(1) {
    float: left;
}

.q_ttl li:nth-child(2) p{
    padding-left: 80px;
    font-size: 24px;
    color: #469ee7;
    line-height: 1.4;
}


.calcium{
	max-width:660px;
	margin:0 auto;
}

.inter_bg.noafter:before {
	content:none;
}



@media screen and (max-width: 900px){
	
	.inter_bg {
		margin-bottom:180px;
	}
	
}

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

	
	.sec01,.sec02{
		margin-bottom:80px;
	}
	
	.sec01 .detail{
		margin-bottom:80px;
	}
	
	.sec03{
		padding-bottom:50px;
	}
	
	.detail {
		margin: 0 auto 100px;
	}
	/*
	.txt_wrap {
		display: block;
	}
	.txt_wrap > * {
		margin-bottom: 20px;
		width: 100%;
	}
	*/
	
	.inter_bg{
		margin-top: 30px;
    	margin-bottom: 50px;
	}
	
	
	.q_ttl,.ques02{
		padding-left:0;
	}

	
}

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

	
	.q_ttl li:nth-child(2) p{
		font-size:15px;
	}	
	

	

	
	.illust.i02{
		max-width:391px;
		margin:0 auto 50px;
	}
	
	.illust.i02 li{
		float:none;
		width:auto;
		margin-bottom:30px;
	}
	
	.illust.i02 li:nth-child(2){
		margin-bottom:0;
	}
	
	
	.illust.i03{
		max-width:370px;
		margin:0 auto 50px;
	}
	
	.illust.i03 li{
		float:none;
		width:auto;
		margin-bottom:30px;
	}
	
	.illust.i03 li:nth-child(2){
		margin-bottom:0;
	}
	
}


@media screen and (max-width: 600px){
	
	.illust.i01{
		max-width:340px;
		margin:0 auto 50px;
	}
	
	.illust.i01 li{
		float:none;
		width:auto;
		margin-bottom:30px;
	}
	
	.illust.i01 li:nth-child(2n){
		float:none;
	}
	
	
	.inter_wrap .intro.gray li:nth-child(1) {
	    background: #e3e0dd;
	}
	
}