/***　コンテンツページ用CSS　***/

/***共通***/
div.banner{margin-bottom:0}

/*******************/
/***コンテンツTOP***/
/*******************/

/*コンテンツバナー*/
#cnt_top ul.bnr_contents{
background-color:#F6FBF9;
border-radius:50px;
padding:30px 30px;
margin-bottom:50px;
justify-content:space-between;
-webkit-justify-content:space-between;
}
#cnt_top .bnr_contents li{
width:48%;
margin-bottom:30px;
}

p.apl_img img{border-radius:20px}
.appeal div{
width:80%;
margin:-80px auto 0 auto;
box-shadow:2px 2px 4px #777;
border-radius:10px;
padding:40px 20px 20px 20px;
background:#fff;
position:relative;
}
.appeal div p{font-weight:bold}
.appeal li a:hover div{
background-color:#EAF2D2;
}


p.apl_num, p.clmtop_num{
font-family: 'Niconne', cursive;
color:#5dab93;
font-size:2.2rem;
letter-spacing:0.1em;
}
p.apl_text{
font-size:1.4rem;
font-family:'Noto Sans JP', sans-serif;
}
p.apl_more{
font-size:1.4rem;
border-bottom:2px solid #5dab93;
text-align:right;
}
p.apl_more a{
color:#444;
}
p.apl_more a:hover{
text-decoration:underline;
}
hr.apl_footer{
border-bottom:2px solid #5dab93;
margin-top:20px;
}



/********************/
/***コンテンツ詳細***/
/********************/
div#clm_wrap{
background-color:#F6FBF9;
}
#cnt_clm .banner div{display:none}
div.clm_all{
background-color:#fff;
padding:40px 60px;
}
div.clm_top{padding-bottom:40px}
p.clmtop_img{text-align:center}
div.clm_top img{
width:85%;
border-radius:10px 50px 10px 10px;
}
.clm_top div{
width:35%;
margin:-170px 0 0 110px;
box-shadow:2px 2px 4px #777;
border-radius:10px;
padding:50px 30px;
background:#fff;
position:relative;
}
.clm_top div p{
font-weight:bold
}
hr.clm_line{
border:none;
border-bottom:2px solid #5dab93;
}
div.clm_intro, .clm_main p{
padding:10px 0;
}
div.clm_main{
padding-top:20px;
}
p.clm_textimg{
text-align:center;
}
div.clm_tonext, div.clm_totop{
padding-top:30px;
}
.clm_tonext p a{
color:#5dab93;
}
.clm_tonext p a:hover{
text-decoration:underline;;
}
div.clm_totop{
width:30%;
margin-left:auto;
margin-right:auto;
}
.clm_totop a p{
color:#fff;
font-weight:bold;
text-align:center;
background-color:#5dab93;
border:1px solid #5dab93;
border-radius:20px;
padding:10px 0;
}
.clm_totop a:hover p{
background-color:#fff;
color:#5dab93;
}



/***************************************/
/*****　タブレット用CSS(iPad基準)　*****/
/***************************************/
@media screen and (max-device-width:768px) {



}

/****************************************************/
/*****　スマホ用横置き専用CSS(iPhone6plusまで)　*****/
/****************************************************/
@media screen and (max-device-width:736px) and (orientation: landscape){


}

/**********************************************/
/*****　スマホ用CSS(iPhone6plusまで対応)　*****/
/**********************************************/
@media screen and (max-device-width:414px) , screen and (max-device-width:736px) and (orientation: landscape){

/***コンテンツTOP***/
#cnt_top .bnr_contents li{
width:100%;
margin-top:20px;
margin-bottom:70px;
}
.appeal div{margin-top:-250px}
hr.apl_footer{margin-top:30px}

/***コンテンツ詳細***/
#cnt_clm div.banner{
background-color:#fff;
padding-bottom:30px;
}
#cnt_clm .banner div{display:block}
div.clm_all{background-color:#F6FBF9}
.clm_all div{background-color:#fff}
div.clm_top{padding-bottom:80px}
div.clm_top img{width:100%}
.clm_top div{
width:85%;
margin:-150px auto 0 auto;
}
p.clmtop_text{line-height:160%}
p.clmtop_num{font-size:4.2rem !important}
hr.clm_line{
margin:0;
background-color:#fff;
}
.clm_intro p, .clm_main p{line-height:160%}
p.clm_textimg img{width:100%}
div.clm_totop{width:70%}
div.clm_totop{background-color:#F6FBF9}
.clm_totop a p{border-radius:40px}



}