@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css?family=Playfair+Display|Playfair+Display+SC|Roboto:100');
@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

#dejilin{
	width:100%;
	height:auto;
	font-family: 'Sawarabi Gothic', sans-serif;
	
}



#dejilin .title{
/*	width:100%;
		text-align:center;
	background-color:#fff;*/
	/* padding:50px 0; */
	max-width:1320px;
	margin:auto;
	width:90%;
}


#dejilin #main{
	display:flex;
	flex-wrap: wrap;
		max-height:400px;

}



#dejilin #main .box2{
	width:50%;

	background-color:#666;
	 align-items: baseline;


}


#dejilin #main h2{
	font-size:45px;
	line-height:1.5;
	color:#fff;
	text-align:center;
	margin-top:110px;
	    font-weight: 100;
}


#dejilin #main .main_img{
	 -moz-box-sizing: border-box;
    box-sizing: border-box;
	background-image:url(../../img/lp/dejilin/main.jpg);
	overflow:hidden;
	background-size:cover;
	background-position:0 -50px ;
	background-repeat:no-repeat;
}


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

#dejilin #main{
		display:block;
		max-height:auto;
		max-height:320px;
}



#dejilin #main .box2{
	width:100%;


}



#dejilin #main h2{
	font-size:20px;
	margin-top:0px;
	padding:15px 0;
}

#dejilin #main .main_img{
	background-position:0 0px ;
	height:250px;
}


}

/*--------------------------

メニューナビ

----------------------*/

#dejilin ul#deji_menu{
	text-align:center;
	margin:30px 0;
}

#dejilin ul#deji_menu li{
	display:inline-block;
	list-style:none;
	margin:0 1%;
}



#dejilin ul#deji_menu li a{
		text-decoration:none;
	font-weight:bold;
	line-height:2.5;

  position: relative;
  display: inline-block;
  text-decoration: none;
  color:#666;
}
#dejilin ul#deji_menu a::after {
 position: absolute;
  bottom: -4px;
  left: 0;
  content: '';
  width: 100%;
  height: 1px;
  background: #9E8580;
  transform: scale(0, 1);
  transform-origin: left top;
  transition: transform .3s;
  margin-bottom:5px;

}
#dejilin ul#deji_menu li a:hover::after {
  transform-origin: left top;
  transform: scale(1, 1);
}





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



#dejilin ul#deji_menu li{
	width:28%;
	display:inline-block;
	list-style:none;
	margin:0 0;
}

#dejilin ul#deji_menu li a{
	background-color:#ECECEC;
	display:block;
	margin:10px 0;
	padding:5px 0;

}



}









/*---------------------*/


#dejilin p{
	font-size:18px;
	line-height:2.0;
}


#dejilin .ttl_mini{
	font-size:20px;
	color:#8C2515;
	border-bottom:1px solid #8C2515;
	text-align:center;
	max-width:200px;
	padding-bottom:16px;
	margin:0 auto;
	padding:0px;
		font-family: 'Josefin Sans', sans-serif;

}

#dejilin .ttl_deji{
	font-size:30px;
	text-align:center;
	padding:30px 0;

}

#dejilin .ttl_deji span{
	font-size:50px;
}





#dejilin .box{
	width:100%;
	margin:80px auto;
	text-align:center;

}
#dejilin .w800{
	max-width:800px;

}



#dejilin span.mark{
	background-color:#E8D3D0;


}



#dejilin .conts{
	width:45%;
	display:inline-block;
	vertical-align:top;
	text-align:center;
	margin:0 auto;
	
}

#dejilin .box .conts p{
	text-align:left;
}



#dejilin .w500{
	max-width:500px;
}


#dejilin #demelit{
	background-image:url(../../img/lp/dejilin/bg.jpg);
	padding:60px 0;
		position:relative;
		margin:80px 0;

}


#dejilin #demelit .white{
	width:900px;
	background-color:#FFF;
	margin:0 auto;
	padding:50px 0;
}

#dejilin #demelit ul{
	margin-left:20%;
}


#dejilin #demelit ul li{
	font-size:24px;
	

}




#dejilin #demelit ul li:before{
	content:url(../../img/lp/dejilin/check.jpg);
}



#dejilin #demelit img{
	position:absolute;
	top:-130px;
	left:3%;
}



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

#dejilin .ttl_mini{
	font-size:14px;
	padding-top:30px;

}


#dejilin p{
	font-size:16px;
}



#dejilin .w800{
	width:90%;
	margin:0 5%;

}

#dejilin .ttl_deji{
	font-size:20px;
	padding:20px 0;
	max-width:90%;
	margin: 0 5%;

}

#dejilin .ttl_deji span{
	font-size:20px;
}



#dejilin .box{
	margin:30px auto;

}

#dejilin .conts{
	width:90%;
	display:block;
	
}
#dejilin .conts img{
	margin:30px 0;


}



#dejilin #demelit{
	padding:10px 0;
		position:relative;
		margin:30px 0;

}


#dejilin #demelit .white{
	width:90%;
	background-color:#FFF;
	margin:5% auto;
	padding:3% 0;
}

#dejilin #demelit ul{
	margin-left:5%;
	margin-right:5%;
}


#dejilin #demelit ul li{
	font-size:18px;
	line-height:2.3;
}


/*

#dejilin #demelit ul li:before{
content: '';
  display: inline-block;
  width: 25px;
  height: 25px;
  background-image: url(../../img/lp/dejilin/check.jpg);
  background-size: contain;
  vertical-align: middle;
  }
*/

#dejilin #demelit ul li:before{
	content:none;
}



#dejilin #demelit ul li{
  background-image: url(../../img/lp/dejilin/check.jpg);
  background-repeat:no-repeat;
  padding-left:30px;
  background-size:30px;
  background-position:0 5px;
  border-bottom:1px solid #ccc;
  

}


#dejilin #demelit img{
	position:relative;
	top:20px;
	left:0;
	width:80%;
	margin-left:10%;
	padding-bottom:5%;
}




}




/*--------------------

コンテンツ一覧


-*/

#dejilin #movie {
	width:100%;
	text-align:center;
}
#dejilin #movie dl{
	width:33%;
	max-width:480px;
	display:inline-block;
	padding:40px 40px;
	background-color:#333333;
	color:#FFF;
	margin:80px 20px 0px;
}


#dejilin #movie dl dd {
		margin:20px 0;

}


#dejilin #movie dl dd a{
	color:#FFF;
	border:1px solid #FFF;
	width:100%;
	display:block;
	padding:10px 0;
}


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


#dejilin #movie dl{
	width:80%;
	max-width:auto;
	display:block;
	padding:5%;
	background-color:#333333;
	color:#FFF;
	margin:30px auto 0px auto;
}




}

/*--------------------

HOWTO


-*/



#dejilin #howto dl{
	width:28%;
	max-width:360px;
	display:inline-block;
	padding:0;
	margin:100px 1% 20px 1%;
	vertical-align:top;
}


#dejilin #howto dl dd {
		margin:20px 0;
		text-align:left;
		font-size:18px;

}


#dejilin #howto dl dd a{
	text-decoration:underline;
}


#dejilin #howto dl dt {
font-family: 'Roboto', sans-serif;
}



#dejilin #howto dl dt:before{
		position:absolute;
	margin-top:-60px;
	margin-left:10%;
		background-color:#8C2514;
	background-size:80px 80px;
	font-size:24px;
	border-radius: 100%;/*角丸*/
	padding:20px 30px;
	color:#FFF;

}

#dejilin #howto dl.step1 dt:before{
	content:'1';

}

#dejilin #howto dl.step2 dt:before{
	content:'2';
}

#dejilin #howto dl.step3 dt:before{
	content:'3';


}



#dejilin #howto dl img{
		z-index:-2;
		position:relative;
}



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

#dejilin #howto dl{
	width:90%;
	max-width:100%;
	display:block;
	padding:0;
	margin:80px 5% 20px 5%;
	vertical-align:top;
}
#dejilin #howto dl dt:before{
		position:absolute;
	margin-top:-40px;
	margin-left:15%;
		background-color:#8C2514;
	background-size:50px 50px;
	font-size:18px;
	padding:20px 30px;
	color:#FFF;

}

#dejilin #howto dl dd {
	font-size:16px;
	text-align:center;

}

}

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

#dejilin #howto dl dt:before{
	margin-left:30%;

}

#dejilin #howto dl dd {
	text-align:left;

}

}



/*----------------------------

LINE について

------------------------*/

#deji_line{
	background-color:#ECECEC;
	width:100%;
	padding:80px 0;
}




#deji_line .w800{
	margin:0 auto;
}

#dejilin .btn_wrap{
	width:100%;
	text-align:center;
}

#dejilin .btn_line{
	margin-top:50px;
	margin-bottom:50px;
	/*margin-left:15%;*/
}


#dejilin .btn_line br{
	display:none;
}




#dejilin .btn_line a{
	background:#00B900;
	color:#FFF;
	font-size:18px;
	position:relative;
	padding:20px 30px 20px 60px;
}


#dejilin .btn_line span img{
	position:absolute;
	top:10px;
	left:10px;
	width:46px;
	height:auto;
}


/*
#deji_line .btn_line span:before{
	content:url(../../img/lp/dejilin/line_icon.jpg);
	position:absolute;
	top:5px;
	left:20px;
	
}*/



#deji_line .ttl_line{
	background-color:#CCCCCC;
	text-align:center;
	margin-top:80px;
}










#dejilin #deji_line dl{
	width:45%;
	max-width:310px;
	display:inline-block;
	padding:0;
	margin:80px 5% 20px 5%;
	vertical-align:top;
}



#dejilin #deji_line dl dd {
		margin:20px 0;
		text-align:left;
		font-size:18px;

}


#dejilin #deji_line dl dd span{
	font-size:14px;
}


#dejilin #deji_line dl dd a{
	text-decoration:underline;
}


#dejilin #deji_line dl dd.id{
	border:2px solid #CCC;
		font-family: 'Josefin Sans', sans-serif;
	text-align:center;
	padding:15px 0;
	letter-spacing:0.1em;
	background-color:#FFF;

}


#dejilin #deji_line dl dt {
font-family: 'Roboto', sans-serif;
}


#dejilin #deji_line dl dt img{
	border:3px solid #FFF;
}



#dejilin #deji_line dl dt:before{
		position:absolute;
	margin-top:-60px;
	margin-left:7%;
	font-size:20px;
	padding:20px 30px;

}

#dejilin #deji_line dl.step1 dt:before{
	content:'STEP 1';

}

#dejilin #deji_line dl.step2 dt:before{
	content:'STEP 2';
}



#dejilin #deji_line ul{

counter-reset: number 0;  
}

#dejilin #deji_line ul li{
	font-size:18px;
	list-style:none;
	line-height:2.0;
}



#dejilin #deji_line ul li:before{
counter-increment: number ;      /* number カウンタの増加数をセット */
	  content: "0" counter(number);      /* 表示形式を指定 */
	  margin-right:15px;
	  
}
#dejilin #deji_line .white{
	background-color:#FFF;
	padding:30px;
	margin-top:20px;
	font-size:16px;
}






#foot_deji{
	margin-top:80px;
}


#foot_deji p a{
	text-decoration:underline;
}



#foot_deji p br{
	display:none;
}



#dejilin #foot_deji .btn_line a{
	font-size:24px;
	position:relative;
	padding:20px 30px 20px 60px;
	max-width:650px;
	margin:0 auto;
}






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





#dejilin #deji_line dl{
	width:45%;
	max-width:100%;
	display:inline-block;
	padding:0;
	margin:80px 2% 20px 2%;
	vertical-align:top;
}



#dejilin #deji_line dl dd {
		margin:20px 0;
		text-align:left;
		font-size:16px;

}


#dejilin #deji_line dl dd.id{
	padding:5px 0;
	letter-spacing:0;

}


#dejilin #deji_line dl dt:before{
		position:absolute;
	margin-top:-50px;
	margin-left:7%;
	font-size:14px;

}



/*-------------------

ボタン

----------------------*/



#dejilin .btn_line br{
	display:block;
}



#dejilin .btn_line a{
	display:block;
	font-size:12px;
	position:relative;
	padding:20px 30px 20px 60px;
}


#dejilin .btn_line span img{
	position:absolute;
	width: 30px;
	top:/*14px*/10px;
	left:10px;
	width:65px;
	height:auto;
}

#dejilin #foot_deji .btn_line a{
	font-size:/*16px*/12px;
	padding:20px 0px;
	max-width:100%;
	width:90%;
	margin:0 5%;
}

#dejilin #foot_deji .btn_line{
	margin-top:20px;
	margin-bottom:20px;
}



#dejilin #deji_line ul li{
	font-size:16px;
	border-top:1px dotted #CCC;
	padding:15px 0;
}

#foot_deji{
	margin-top:30px;
	margin-bottom:80px;
}


#foot_deji p br{
	display:block;
}







}