/*===============================================
　SP iPhone6以上（画面の横幅が761pxまで）
===============================================*/

@media (max-width:761px){
	
	/* ============================================================
 	main vi 
	==============================================================*/
    
	#main_sec_wrap{
		width: 100%;
		padding: 120px 10% 20px;
		box-sizing:border-box;
		position: relative;
	}

	#main_sec_wrap .sh_ttl{
		display:none;
	}

	#main_sec_wrap .ttl_box{
	}

	
	
	/* ============================================================
 	section 01
	==============================================================*/
	
	#sec01{
		width: 100%;
		padding: 0 0 50px;
		position:relative;
	}

	
	#sec01 .wrapper{
		padding: 0;
	}


	#sec01 ul.tab_btn_list{
		display: flex;
		justify-content: space-between;
	}

	#sec01 ul.tab_btn_list li{
		width:18%;
		box-sizing:border-box;
		position:relative;
		padding:0 1px 0 0;
	}
	#sec01 ul.tab_btn_list li:nth-child(1){width:24%}
	#sec01 ul.tab_btn_list li:nth-child(2){width:40%}
	#sec01 ul.tab_btn_list li:nth-child(4){padding:0;}

	#sec01 ul.tab_btn_list li a{
		display:block;
		text-align:center;
		background:#000;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size: 1.4rem;
		letter-spacing: 0rem;
		color:#fff;
		line-height:1;
		padding: 12px 0 14px;
	}

	#sec01 ul.tab_btn_list li a span{
		font-weight: 600;
		display: block;
		padding: 0 0 5px;
	}

	#sec01 ul.tab_btn_list li:nth-child(1).act a{
		background:#f2dfeb;
		color:#b56e9d;
		pointer-events: none;
	}

	#sec01 ul.tab_btn_list li:nth-child(2).act a{
		background:#E1EFDD;
		color:#78A86A;
		pointer-events: none;
	}

	#sec01 ul.tab_btn_list li:nth-child(3).act a{
		background:#F7E7DA;
		color:#DB6C21;
		pointer-events: none;
	}

	#sec01 ul.tab_btn_list li:nth-child(4).act a{
		background:#E1F4F9;
		color:#54A0B5;
		pointer-events: none;
	}


	#sec01 .tab_block{
		position:relative;
		padding: 40px 0 0;
	}

	#sec01 .tab_block:before{
		content: "";
		display: block;
		width: 100vw;
		height: 143px;
		position: absolute;
		top: 0;
		left:50%;
		transform:translate(-50%,0);
		z-index:-1;
	}

	#sec01 .c_fcw:before{background:#F2DFEB;}
	#sec01 .c_fcm:before{background:#E1EFDD;}
	#sec01 .c_fe:before{background:#F7E7DA;}
	#sec01 .c_fhs:before{background:#E1F4F9;}

	#sec01 h2{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 300;
		font-size: 3.2rem;
		text-align:center;
		line-height: 1.0;
		letter-spacing: 0;
		padding: 0 0 30px;
	}

	#sec01 h2 span{
		display:inline-block;
		font-weight: 600;
		padding:0 2px 0 0;
	}

	#sec01 p{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 500;
		font-size: 1.3rem;
		line-height: 1.4;
		letter-spacing: 0.1rem;
		font-feature-settings: 'palt';
		text-indent:-3em;
		padding: 16px 0 0 3em;
	}

	#sec01 p span{
		color:#c90000;
		font-weight: 600;
		padding: 0 5px 0 0;
	}

	#sec01 .c_fcw h2{color: #B56E9D;}
	#sec01 .c_fcm h2{color: #78A86A;}
	#sec01 .c_fe h2{color: #DB6C21;}
	#sec01 .c_fhs h2{color: #54A0B5;}

	#sec01 h3{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size: 2.0rem;
		text-align:center;
		color: #fff;
		line-height: 1.0;
		font-feature-settings: 'palt';
		letter-spacing: 0;
		padding: 26px 0 31px;
		box-sizing: border-box;
		width:100%;
		border-radius: 60px;
	}

	#sec01 h3 span{
		display:inline-block;
		font-weight: 600;
		padding:0 2px 0 0;
	}

	#sec01 h3 small{
		display:block;
		font-size: 1.8rem;
		padding:7px 0 0 0;
	}

	#sec01 .c_fcw h3{background:#CE93B9;}
	#sec01 .c_fcm h3{background:#9AC78B;}
	#sec01 .c_fe h3{background:#F6AF74;}
	#sec01 .c_fhs h3{background:#93CCE1;}
	
	
	#sec01 ul.data_list{
		/* display: flex; */
		/* justify-content: space-between; */
		/* flex-wrap:wrap; */
		padding: 0 9%;
	}

	#sec01 ul.data_list > li{
		width: 100%;
		margin: 0 0 80px;
		position: relative;
	}


	#sec01 ul.data_list > li .img_data{
		line-height:0;
		margin: -10px 0 -30px;
	}

	#sec01 ul.data_list > li .txt_block{
		background:#F2F2F2;
		box-sizing: border-box;
		/* min-height: 230px; */
		padding: 50px 37px 90px;
		border-radius:20px;
	}

	#sec01 ul.recruit_list{
		display: flex;
		/* justify-content:space-around; */
		flex-wrap:wrap;
	}

	#sec01 ul.recruit_list:after{
	  content:"";
	  display: block;
	  width:48%;
	}

	#sec01 ul.recruit_list > li{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size: 1.5rem;
		letter-spacing:0.1rem;
		margin: 0 16px 4px 0;
		color:#000;
	}

	#sec01 ul.recruit_list > li span{
		background:#888;
		border-radius:50%;
		display:inline-block;
		vertical-align: text-top;
		font-size: 1.0rem;
		color:#fff;
		padding: 3px 4px 4px 5px;
		line-height: 1;
		margin: 3px 5px 0px 0;
	}
	
	#sec01 .c_fcw span.m_color{	background: #E41673;}
	#sec01 .c_fcm span.m_color{	background: #1D9637;}
	#sec01 .c_fe span.m_color{	background: #E27C17;}
	#sec01 .c_fhs span.m_color{	background: #50A4D8;}


	#sec01 .txt_block a{
		position: absolute;
		bottom: 76px;
		left: 50%;
		transform: translate(-50%, 0);
		display:block;
		width: 200px;
		font-family:
		'Noto Sans JP', sans-serif;
		font-weight: 400;
		font-size:1.6rem;
		text-align:center;
		color: #fff;
		background:#000;
		line-height: 1.0;
		font-feature-settings:
		'palt';
		padding: 9px 0 11px;
		border-radius:20px;
	}

	#sec01 .c_fhs li:nth-child(1) .txt_block a,
	#sec01 .c_fhs li:nth-child(2) .txt_block a,
	#sec01 .c_fhs li:nth-child(3) .txt_block a{
		bottom: 26px;
	}

	

	/* ============================================================
 	sec_nav
	==============================================================*/

	#sec_nav{
		width:100%;
		background:url(/guidance/data/img/slash_bg.gif);
		position:relative;
	}

	#sec_nav:before{
		content: "";
		display: block;
		width: 100%;
		height: 100%;
		background:rgb(255 255 255 / 50%);
		position: absolute;
		top: 0;
		left:0
	}
	
	#sec_nav ul{
		padding:50px 0;
	}

	#sec_nav ul li{
		margin:0 0 10px;
	}

	#sec_nav ul li a{
		display:block;
		background:#fff;
		border-radius: 14px;
		padding:0 20px;
		line-height:0;
		border:2px solid #ccc;
	}
	
	/* ============================================================
 	Modal CSS
	==============================================================*/
	
	#modal_win {
		position: fixed;
		top: 0;
		left: 0;
		background: rgba(0,0,0,0.8);
		width: 100vw;
		height: 100vh;
		z-index: 10000;
		display: none;
		cursor: pointer;
	}

	#modal_win .m_n_wrap {
		position: relative;
		width: 100%;
		height: 100vh;
	}

	#modal_win .m_n_box {
		position: absolute;
		top: 44%;
		left: 50%;
		transform:translate(-50%, -50%);
		opacity:0;
		width: 90vw;
		transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
	}

	#modal_win .m_n_box_act{
		opacity:1;
		transform:translate(-50%, -50%);
	}
    
    #modal_win h2{
        font-family: 'Noto Sans JP', sans-serif;
        font-weight:500;
        font-size: 2.4rem;
        text-align:center;
        color:#fff;
        padding: 0 0 6px;
    }
    
     #modal_win h3{
        font-family: 'Noto Sans JP', sans-serif;
        font-weight:500;
        font-size: 1.6rem;
        letter-spacing:0.1rem;
        line-height:1;
        padding: 8px 0 4px;
        border-radius: 50px;
        /* background: #e0e0e0; */
        color: #000;
        width:300px;
    }

	#modal_win h3.c_mt{
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:500;
		font-size: 1.8rem;
		margin:50px auto 20px;
	}
    
    #modal_win p{
        font-family: 'Noto Sans JP', sans-serif;
        font-weight:400;
        font-size: 1.5rem;
        text-align:left;
        padding: 0 0 20px;
        margin: 0 0 20px;
        border-bottom: 1px dotted #ccc;
    }

	#modal_win p.ex_txt{
        font-family: 'Noto Sans JP', sans-serif;
        font-weight:400;
        font-size: 1.5rem;
        padding: 0;
        margin: 0;
        border-bottom:none;
    }

	#modal_win h3 span{
		background:#888;
		border-radius:50%;
		display:inline-block;
		vertical-align: text-top;
		font-size: 1.0rem;
		color:#fff;
		padding: 3px 4px 4px 5px;
		line-height: 1;
		margin: 4px 5px 0px 0;
	}
	
	#modal_win .c_fcw span.m_color{	background: #E41673;}
	#modal_win .c_fcm span.m_color{	background: #1D9637;}
	#modal_win .c_fe span.m_color{	background: #E27C17;}
	#modal_win .c_fhs span.m_color{	background: #50A4D8;}
    
    #modal_win .tw_wrap{
		width:100%;
		max-height: 60vh;
		overflow-y: auto;
		overflow-x: hidden;
		border-radius: 20px;
		background: #fff;
		padding: 50px 10% 50px;
		box-sizing:border-box;
	}
    
	#modal_win ul > li{
		position:fixed;
		bottom: -32px;
		left: 50%;
		transform:translate(-50%, -50%);
	}
	
	#modal_win a.xClose{
		display:block;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight:400;
		font-size: 1.6rem;
		text-align:center;
		color:#fff;
		position: relative;
	}

	#modal_win a.xClose span{
		display:block;
		width:50px;
		line-height:0;
		border-radius:50%;
		border:2px solid #fff;
	}

	

}



/*===============================================
　SP iPhone5サイズ対応　画面の横幅が350pxまで▼▼▼▼▼
===============================================*/

@media (max-width:349px) {
	
}

/*===============================================
　SP iPhone Plus サイズ対応　画面の横幅が415pxまで▼▼▼▼▼
===============================================*/

@media (min-width: 413px) and (max-width: 761px) {
	
}