/* ============================================================
PC
==============================================================*/

@media (min-width: 762px) {
	
	
	/* ============================================================
 	main vi 
	==============================================================*/
    
	#main_sec_wrap{
		width: 100%;
		border-top: 77px solid #e1e1e1;
		padding: 50px 0 100px;
		position: relative;
	}

	#main_sec_wrap .sh_ttl{
		width: 150px;
		position:absolute;
		top: 15px;
		right: 15px;
	}

	#main_sec_wrap .ttl_box{
		width: 380px;
		margin: 0 auto;
	}

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

	
	#sec01 .wrapper{
		
	}


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

	#sec01 ul.tab_btn_list li{
		width: 25%;
		box-sizing:border-box;
		position:relative;
	}

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

	#sec01 ul.tab_btn_list li a span{
		font-weight: 600;
	}

	#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 ul.tab_btn_list li a{
		transition: all 0.5s cubic-bezier(0.21, 0.68, 0.4, 1.02) 0s;
	}

	#sec01 ul.tab_btn_list li a:hover{
		opacity:0.5;
	}

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

	#sec01 .tab_block:before{
		content: "";
		display: block;
		width: 100vw;
		height: 190px;
		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: 4.2rem;
		text-align:center;
		line-height: 1.0;
		letter-spacing: 0.3rem;
		padding: 0 0 50px;
	}

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

	#sec01 p{
		width: 640px;
		font-family: 'Noto Sans JP', sans-serif;
		font-weight: 500;
		font-size: 1.4rem;
		text-align:center;
		line-height: 1.0;
		letter-spacing: 0.1rem;
		font-feature-settings: 'palt';
		padding: 12px 12px 14px;
		margin: -50px auto 0;
		border: 2px solid #e48b8b;
	}

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

	#sec01 .c_fcm p{
		width:340px;
		box-sizing:border-box;
		margin: 14px auto 0;
		line-height:1.4;
		text-indent: -3.3em;
		text-align:left;
		padding: 12px 6px 14px 4em;
	}

	#sec01 .c_fhs p{
		width:340px;
		box-sizing:border-box;
		margin: 14px auto 0;
		line-height:1.4;
		text-indent: -3.3em;
		text-align:left;
		padding: 12px 6px 14px 4em;
	}

	#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.4rem;
		text-align:center;
		color: #fff;
		line-height: 1.0;
		font-feature-settings: 'palt';
		letter-spacing: 0;
		padding: 36px 0 41px;
		width:100%;
		border-radius: 60px;
		margin:0 auto;
	}

	#sec01 h3.l2{
		padding: 24px 0 30px;
	}

	#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 140px;
	}

	#sec01 .c_fcw ul.data_list{
		padding: 0;
	}

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

	#sec01 .c_fcw ul.data_list > li{
		width: 30%;
	}

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

	#sec01 ul.data_list > li .txt_block{
		background:#F2F2F2;
		box-sizing: border-box;
		min-height: 230px;
		padding: 50px 37px 0;
		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: 26px;
		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_fcm .txt_block a{
		bottom: 130px;
	}
	
	#sec01 .c_fhs li:nth-child(3) .txt_block a,
	#sec01 .c_fhs li:nth-child(4) .txt_block a{
		bottom: 127px;
	}

	#sec01 .txt_block a{
		transition: all 0.5s cubic-bezier(0.21, 0.68, 0.4, 1.02) 0s;
	}

	#sec01 .txt_block a:hover{
		opacity:0.5;
	}

	/* ============================================================
 	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{
		display:flex;
		justify-content:space-between;
		padding:50px 150px;
	}

	#sec_nav ul li{
		width:46%;
	}

	#sec_nav ul li a{
		display:block;
		background:#fff;
		border-radius:20px;
		padding:0 20px;
		line-height:0;
		border:2px solid #ccc;
	}

	#sec_nav li a{
		transition: all 0.5s cubic-bezier(0.21, 0.68, 0.4, 1.02) 0s;
	}

	#sec_nav li a:hover{
		transform: scale(1.1);
	}
	
	
	/* ============================================================
 	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: 880px;
		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;
		line-height: 2.8rem;
        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: 66vh;
		overflow-y: auto;
		background: #fff;
		padding: 50px 100px 50px;
		/* border-radius: 24px; */
		box-sizing:border-box;
	}
    
	#modal_win ul > li{
		position:fixed;
		top: 20px;
		right: 20px;
	}
	
	#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;
	}

	#modal_win a.xClose span{
		transition: all 0.4s cubic-bezier(0.12, 0.74, 0.36, 1);
	}

	#modal_win a.xClose:hover span{
		transform: scale(1.1);
	}
	
}