/** ========================================
* "「イケカレ」に登録する” "ご利用中の方はこちら"
======================================== **/
#fh5co-hero .fh5co-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #2a2d36;
    opacity: .54;
    z-index: 9;
}

#fh5co-hero .fh5co-intro {
    height: 620px;
    display: table;
    width: 100%;
    z-index: 10;
    /* position: relative;*/
}

@media screen and (min-width: 1401px) {
    #fh5co-hero .fh5co-intro {
        height: 720px;
    }
}


#fh5co-hero .fh5co-intro > div {
    margin-top: 22vw;
    left: 0;
}

@media screen and (min-width: 1401px) {
    #fh5co-hero .fh5co-intro > div {
        margin-top: 500px;
    }
}


.top_text_wrap{
    text-shadow: #000 1.5px 1.5px 1px;
}

.top_text_wrap h2,
.top_text_wrap p{
    color: #FFFFFF;
}
.top_text_wrap h2{
    /*
    font-size: 48px;
    */
    font-size: 28px;
}
.top_text_wrap p{
    /*
    font-size: 24px;
    */
    font-size: 20px;
}




.access_wrap{
    margin-bottom: 30px;
}
@media screen and (min-width: 481px) {
    .access_wrap i{
        margin-left: 0.3em;
        font-size: 48px;
    }
}
@media screen and (max-width: 480px) {
    .access_wrap i{
        margin-left: 0.3em;
        font-size: 16px;
    }
}


.access_ikekare,
.access_ikekare a,
.access_login,
.access_login a{
    margin: 0;
    padding: 0;
    font-family: "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
    color: #565656;
    font-weight: 600;
}
#fh5co-footer div.footer_access_wrap a{
    color: #565656;
    font-weight: 600;
}

.access_ikekare a,
.access_login a{
    height: 80px;
    margin-bottom: 10px;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}




.access_ikekare a{
    background-color: #FFD74D;
    border: 2px solid #FFD74D;

}
.access_login a{
    background-color: #A1ADB3;
    border: 2px solid #A1ADB3;
}

@media screen and (min-width: 481px) {
    .access_ikekare a,
    .access_login a{
        width: 350px;
    }
}

@media screen and (max-width: 480px) {
    #fh5co-hero .fh5co-intro {
        height: 620px;
    }
    #fh5co-hero .fh5co-intro > div {
        /*
        iphone x 6
        margin-top: 440px;
        */
        margin-top: 114vw;
        left: 0;
    }
    .top_text_wrap h2{
        /*
        font-size: 26px;
        */
        font-size: 18px;
        line-height: 1.3em;
        text-align: center;
        color: #Fff;
        text-shadow: 1px 1px 5px #000;
        margin-bottom: 10px;
    }
    .top_text_wrap p{
        text-align: center;
        font-size: 13px;
        line-height: 1.5em;
        color: #FFFFFF;
    }
    .access_wrap,
    .footer_access_wrap{
        display: flex;
        justify-content: space-between;
        align-items: center;
        max-width: 500px;
        width: 100%;
        margin: 0 auto;
    }

    #fh5co-hero .access_ikekare,
    #fh5co-hero .access_login,
    .footer_access_wrap .access_ikekare,
    .footer_access_wrap .access_login{
        display: inline-block;
    }

    #fh5co-hero .access_ikekare,
    .footer_access_wrap .access_ikekare{
        width: 55%;
    }

    #fh5co-hero .access_login,
    .footer_access_wrap .access_login{
        width: 40%;
    }

    .access_ikekare a,
    .access_login a{
        height: 60px;
    }

    .access_ikekare a{
        background-color: #FFD74D;
        border: 2px solid #FFD74D;

        font-size: 14px;
    }
    .access_login a{
        background-color: #A1ADB3;
        border: 2px solid #A1ADB3;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 12px;
    }
    .footer_access_wrap > div{
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

}


@media screen and (max-width: 321px) {

    .top_text_wrap h2{
        font-size: 15px;
        line-height: 1.2em;
    }
    .top_text_wrap p{
        font-size: 11px;
        line-height: 1.1em;
    }


    .access_ikekare a{
        font-size: 12px;
    }
    .access_login a{
        font-size: 11px;
    }
}

/** ========================================
* バレンタイン特典
======================================== **/
#valentine_section{
	background:#F9F2EF;
	padding:3em 0;
	color:#6d3b32;
}
#valentine_section .container{
}
#valentine_section ul{
	list-style: none;
	padding:0;
	display:flex;
	align-items:center;
	flex-direction:column;
}
#valentine_section ul li{
	display:flex;
	justify-content:left;
	align-items:center;
	background-position:0% 50%;
	background-size:5em;
	height:3em;
}

#valentine_section ul li.valentine_list_title{
	height:3em;
	padding:0;
	margin-top:35px;
}

#valentine_section ul li.valentine_list_title div{
	background:#ff9dad;
	border-radius:2px;
	line-height:2em;
	padding-right:2em;
}
#valentine_section ul li.valentine_list_title h3{
	font-size:27px;
	height:2.5em;
	padding-left:3.5em;
	line-height:2.3em;
	margin-top:-1.3em;
	margin-bottom:-0.7em;
	font-weight:600;
}
#valentine_section ul li.valentine_list_period{
	margin-top:-10px;
}
#valentine_section ul li.valentine_list_period h3{font-weight:bold;}
#valentine_section ul li.valentine_list_content{
	margin-top:-9px;
}
#valentine_section ul li.valentine_list_content a{
	transition:0s;
}
#valentine_section ul li.valentine_list_content a h3{
	border-bottom:2px solid #f64662;
}
#valentine_section ul li.valentine_list_content a:hover{
	opacity:0.6;
}
#valentine_section ul li.the_first{margin-top:30px;}
#valentine_section ul li.the_first h3{
	background:url("../images/valentine_icon01.png") no-repeat;
	background-position:0% 50%;
	background-size:3.2em;
}
#valentine_section ul li.the_second h3{
	background:url("../images/valentine_icon02.png") no-repeat;
	background-position:0% 50%;
	background-size:3.2em;
}
#valentine_section ul li.the_third h3{
	background:url("../images/valentine_icon03.png") no-repeat;
	background-position:0% 50%;
	background-size:3.2em;
}


#valentine_section ul li h3{
	margin:0px;
	font-weight:500;
	color:#6d3b32;
	font-size:24px;
}
#valentine_section ul li h3 .fontS{
	font-size:18px;
}
#valentine_section .valentine_content{
	display:flex;
	justify-content:center;
}
.fontS{font-size:18px;line-height:30px;}
.fh5co-lead_02 h2{
	font-size: 52px;
	font-weight: 800;
	color: #FF5768;
	margin:0 0 20px 0;
	  -webkit-text-stroke: 1px #FFF;
	    text-shadow:2px 2px 0 rgba(0,0,0,0.2);
	    margin-bottom:20px;
}
.valentine_sp{ display:none; }
@media screen and (max-width: 826px) {
	.valentine_sp { display:block; }
	#valentine_section ul{
		/*align-items:center;*/
	}
}

#valentine_btn{display:flex;justify-content:center;margin-top:43px;}
#valentine_btn>.access_ikekare a{color:#fff;background:#f64662;border-color:#f64662;}
@media screen and (max-width: 768px) {
	.fh5co-lead_02 h2{-webkit-text-stroke: 0.3px #FFF;}
	
      .fh5co-lead_02 h2{
        font-size: 35px;
      }
      #valentine_section ul li h3{
      	font-size:18px;
      }
}
@media screen and (max-width: 480px) {
	#valentine_section ul li.valentine_list_title{margin-top:3vw;}
	#valentine_section ul li.the_first{margin-top:2vw;}
	#valentine_section ul li.valentine_list_title h3{font-size:6vw;}
	#valentine_section ul li.valentine_list_period h3 .fontS{font-size:4.5vw;}
	.fh5co-lead_02 h2{
		font-size: 30px;
	}
	#valentine_section{padding:15vw 0;}
	#valentine_section ul li{/*padding-left:18vw;*/height:15vw;}
	#valentine_section ul li:nth-child(1){background-size:15vw;}
	#valentine_section ul li:nth-child(2){background-size:15vw;}
	#valentine_section ul li:nth-child(3){background-size:15vw;}
	#valentine_section ul li h3{
		font-size:4vw;
	}
}

/** ========================================
* video_access_wrap
======================================== **/
#video_access_wrap{
	display:flex;
	justify-content:space-between;
	align-items:flex-end;
	margin-bottom:30px;
}
#video_access_wrap video{
	width:416px;
	background:url("../images/video_bg.jpg");
	background-size:100%;
}

@media screen and (max-width: 992px) {
	#video_access_wrap{
	flex-wrap:wrap;
	}
	#video_access_wrap video{
	margin-left:5%;
	margin-right:5%;
	width:90%;
	margin-bottom:10px;
	max-width:100vw;
	}
	#video_access_wrap .access_wrap{width:100%;}
	#video_access_wrap .access_wrap p{
	display:flex;
	justify-content:center;
	}
}
/** ========================================
* story_wrap
======================================== **/
#story_wrap{
	margin-top:25px;
	margin-bottom:30px;
}

#story_wrap .thumbnail_box{
	display:flex;
	flex-direction:column;
	justify-content:center;
	flex-wrap:wrap;
}
#story_wrap .thumbnail_box .thumbnail_box_title{
	display:flex;
	flex-direction:column;
	justify-content:center;
	text-align:center;
	margin:0px 20px;
}

#story_wrap .thumbnail_box .thumbnail_box_contents{display:flex;justify-content:center;	flex-wrap:wrap;}
#story_wrap .thumbnail_box a:hover{opacity:0.6;}
#story_wrap .thumbnail_box a p{color:;margin-bottom:16px;margin-top:10px; text-align:center;}
#story_wrap .thumbnail_box a img{width:250px;max-width:100vw;}
#story_wrap .thumbnail_box a{margin:10px 20px;text-align:center;}
#official_site_btn{display:flex;justify-content:center;margin-top:10px;}
#official_site_btn>.access_ikekare a{color:#fff;background:#f64662;border-color:#f64662;}
@media screen and (max-width: 480px) {
	#story_wrap .thumbnail_box a{margin:0px 0px;}
	#story_wrap{background:none;}
}
/** ========================================
* footerにあるaccess_wrap
======================================== **/

div.footer_access_wrap > div{
}


#fh5co-footer div.row-bottom-padded-md{
    padding-bottom: 1em;
}

@media screen and (min-width: 481px) {
    .footer_access_wrap .access_ikekare a,
    .footer_access_wrap .access_login a{
        margin: 10px auto;
    }
}















/** ========================================
* "「イケないカレシと恋する私。」って？"
======================================== **/
.sales_text{
    background-color: #ED7D31;
    color: #FFFFFF;
}
.sales_text h2{
    color: #FFFFFF;
}
/*一番最後の<p>のみ*/
.sales_text > div > div > p:last-child{
    margin-bottom: 0em;
}

@media screen and (min-width: 481px) {
    .sales_text h2{
        font-size: 32px;
        margin-bottom: 1.5em;
    }
    .sales_text span > p{
        font-size: 28px;
        margin-bottom: 1.0em;
        line-height: 1.2em;
    }
}
@media screen and (max-width: 480px) {
    .sales_text h2{
        font-size: 24px;
        margin-bottom: 1.5em;
    }
    .sales_text span > p{
        font-size: 18px;
        margin-bottom: 0.8em;
        line-height: 1.2em;
    }
}


/** ========================================
* カレシ一覧(mens-list)
======================================== **/
#fh5co-projects{
    background-color: #FFCAEB;
}
.mens-list_wrap{
    background-image: url('../images/mens-list_bk.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;
}
.mens-list_wrap .row:not(:last-child){
    margin-bottom: 30px;
}
.mens-list{
    position: relative;
}
.mens-list img{
    border: solid 1px rgba(72, 76, 80, 0.8);
}
/*
.mens-list_messe{
    font-size: 60px;
    font-weight: 300;
    color: #484c50;
    background-color: rgba(255, 0, 0, 0.7);
    height: 100%;
}
div.mens-list_messe > p{
    margin: 0;
    line-height: 1.0em;
}
@media screen and (max-width: 480px) {
    .mens-list_messe{
        font-size: 30px;
    }
}
*/





/*最終行のmarginの調整*/
#fh5co-projects div.mens-list_last-row > div.mens-list > a{
    margin-bottom: 0px;
}


/** ========================================
* 画像による記事(img-section)
* ・section_2
* ・section_4
* ・section_5
======================================== **/
.img-section {
	margin: 0;
    padding: 0;
    background-color: #FFFFFF;
}
.img-section img {
	width: 100%;
}

@media screen and (min-width: 481px) {
    .img-section_sp{
        display: none;
    }
}

@media screen and (max-width: 480px) {
    .img-section_pc{
        display: none;
    }
}

/** ========================================
* footer
======================================== **/
#fh5co-footer{
    background-color: #F9F2EF;
}



