@charset "UTF-8";

h3{
    font-size: calc(100vw / 1600 * 60);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}
.container{
    max-width: 1200px;
    padding-left: 20px;
    padding-right: 20px;
    margin: auto;
}
.link_arrow,
.link_new_window{
    display: flex;
    align-items: center;
    justify-content: center;
    border: #D20000 1px solid;
    position: relative;
    font-size: calc(100vw / 1600 * 16);
    color: #D20000;
    font-weight: 500;
    width: calc(100vw / 1600 * 212);
    height: calc(100vw / 1600 * 56);
    margin: auto;
    background-color: #fff;
    margin-top: calc(100vw / 1600 * 60);
	font-weight: 700;
}
.link_arrow::after{
    content: "";
    height: calc(100vw / 1600 * 12);
    width: calc(100vw / 1600 * 12);
    border-right: #D20000 2px solid;
    border-top: #D20000 2px solid;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
    right: calc(100vw / 1600 * 20);
}
.link_new_window::after{
    content: "";
    height: calc(100vw / 1600 * 21);
    width: calc(100vw / 1600 * 16);
    background-image: url(../images/common/new_window.svg);
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    background-size: contain;
    background-repeat: no-repeat;
}
.txt_yel{
    color: #FFDC14;
}
.txt_white{
    color: #fff;
}
.txt_red{
    color: #D20000;
}
/*-------------------------------------------
---------------------------------------------
sub_mv
----------------------------------------------
--------------------------------------------*/
.sub_mv{
    position: relative;
}
.sub_mv .container{
    display: flex;
    height: calc(100vw / 1600 * 350);
    
}
.sub_mv .sub_mv_txt h2{
    font-size: calc(100vw / 1600 * 60);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    padding-top: calc(100vw / 1600 * 125);
}
.sub_mv .sub_mv_txt p{
    font-size: calc(100vw / 1600 * 28);
    color: #fff;
    margin-top: calc(100vw / 1600 * 5);
}
.sub_mv .sub_mv_txt ul{
    display: flex;
    color: #fff;
    font-size: calc(100vw / 1600 * 14);
    margin-top: calc(100vw / 1600 * 78);
}
.sub_mv .sub_mv_txt ul li{
    margin-right: calc(100vw / 1600 * 45);
}
.sub_mv .sub_mv_txt ul li a{
    opacity: .7;
    position: relative;
	display: inline-block;
    text-decoration: none;
}
.sub_mv .sub_mv_txt ul li a::before {
	position: absolute;
	bottom: -4px;
	left: 0;
	content: '';
	width: 100%;
	height: 1px;
	background: #fff;
	transform: scale(0, 1);
	transform-origin: left top;
	transition: transform .3s;
}
.sub_mv .sub_mv_txt ul li a:hover::before {
    transform: scale(1, 1);
}
.sub_mv .sub_mv_txt ul li a::after{
    content: "";
    position: absolute;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    height: calc(100vw / 1600 * 8);
    width: calc(100vw / 1600 * 8);
    transform: rotate(45deg) translateY(-50%);
    top: 50%;
    right: calc(100vw / 1600 * -19)
}
.sub_mv .sub_mv_txt::after{
    content: "";
    background-color: #D20000;
    position: absolute;
    z-index: -1;
    height: 100%;
    width: 10000px;
    top:0;
    right: calc(100vw / 1600 * 63);
    transform: translate(-48.5vw) skew(-19deg);
    
}
.sub_mv .container .sub_mv_img{
    position: absolute;
    right: 0;
    z-index: -2;
}
.sub_mv .container .sub_mv_img figure{
    width: calc(100vw / 1600 * 900);
    height: calc(100vw / 1600 * 350);
}
.sub_mv .container .sub_mv_img figure img{
    width: 100%;
}
.sub_mv_img::after{
    content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #D20000;
    opacity: 0.02;
    top: 0;
    left: 0;
}
/*-------------------------------------------
---------------------------------------------
welfare
----------------------------------------------
--------------------------------------------*/
.welfare{
    margin-top: calc(100vw / 1600 * 65);
}
.welfare_flex1,
.welfare_flex2{
    display: flex;
}
.welfare_flex1{
    flex-wrap: wrap;
    justify-content: space-between;
}
.welfare_flex2{
    width: 860px;
    justify-content: space-between;
    margin: auto;
}
.welfare_flex1 div,
.welfare_flex2 div{
    width: 260px;
    height: 180px;
    background-color: #FDF0F2;
    
    margin-bottom: calc(100vw / 1600 * 40);
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
}
.welfare_flex1 div:first-child figure{
    width: calc(100vw / 1600 * 112);
    height: calc(100vw / 1600 * 94);
}
.welfare_flex1 div:nth-child(2) figure{
    width: calc(100vw / 1600 * 102);
    height: calc(100vw / 1600 * 85);
}
.welfare_flex1 div:nth-child(3) figure{
    width: calc(100vw / 1600 * 75);
    height: calc(100vw / 1600 * 75);
	margin-top: 13px;
}
.welfare_flex1 div:nth-child(4) figure{
    width: calc(100vw / 1600 * 80);
    height: calc(100vw / 1600 * 76);
	margin-top: calc(100vw / 1600 * 13);
} 
.welfare_flex2 div:nth-child(1) figure{
    width: calc(100vw / 1600 * 102);
    height: calc(100vw / 1600 * 102);
}
.welfare_flex2 div:nth-child(2) figure{
    width: calc(100vw / 1600 * 78);
    height: calc(100vw / 1600 * 82);
}
.welfare_flex2 div:nth-child(3) figure{
    width: calc(100vw / 1600 * 115);
    height: calc(100vw / 1600 * 82);
	margin-top: calc(100vw / 1600 * 13);
}
.welfare_flex2 div:nth-child(3) p{
    margin-bottom: calc(100vw / 1600 * 12);
}
.welfare div figure img{
	width: 100%;
	height: 100%;
	margin-bottom: calc(100vw / 1600 * -20);
}
.welfare div p{
    text-align: center;
    font-size:  calc(100vw / 1600 * 16);
    color: #D20000;
	margin-bottom: calc(100vw / 1600 * 10);
}
/*-------------------------------------------
---------------------------------------------
map
----------------------------------------------
--------------------------------------------*/
.map{
    width: 100%;
	border: #D20000 solid 1px;
	overflow: hidden;
	border-radius: 11px;
	height: 436px;
}
.map iframe{
    width: 100%;
	height: 100%;
	overflow: hidden;
	border-radius: 11px;
}

/*-------------------------------------------
---------------------------------------------
lead_title
----------------------------------------------
--------------------------------------------*/
.lead_title{
    margin: calc(100vw / 1600 * 160) auto calc(100vw / 1600 * 80) auto;
    text-align: center;
}
.lead_title h3{
    font-family:'Montserrat', sans-serif;
    font-size: calc(100vw / 1600 * 20);
	margin-bottom: calc(100vw / 1600 * 10);
}
.lead_title p:nth-child(2){
    font-size: calc(100vw / 1600 * 28);
    margin-bottom: calc(100vw / 1600 * 55);
	
}
.lead_title p:nth-child(3){
    font-size: calc(100vw / 1600 * 16);
	line-height: 1.8
}




@media screen and (min-width: 1600px) {
    h3{
        font-size: 6rem;
    }
    .link_arrow,
    .link_new_window{
        font-size: 1.6rem;
        width: 212px;
        height: 56px;
		margin-top: 60px;
    }
    .link_arrow::after{
        width: 12px;
        height: 12px;
    }
    .link_new_window::after{
        height: 21px;
        width: 16px;;
    }
	/*-------------------------------------------
    ---------------------------------------------
    sub_mv
    ----------------------------------------------
    --------------------------------------------*/
    .sub_mv .container{
        height: 350px;
    }
    .sub_mv .sub_mv_txt h2{
        font-size: 6rem;
        padding-top: 125px;
    }
    .sub_mv .sub_mv_txt p{
        font-size: 2.8rem;
    }
    .sub_mv .sub_mv_txt ul{
        font-size: 1.4rem;
        margin-top: 78px;
    }
    .sub_mv .sub_mv_txt ul li{
        margin-right: 45px;
    }
    .sub_mv .sub_mv_txt ul li a::after{
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        height: 8px;
        width: 8px;
        right: -19;
    }
    .sub_mv .container .sub_mv_img figure{
        min-width: 900px;
        height: 350px;
    }
    .sub_mv .container .sub_mv_img figure img{
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    /*-------------------------------------------
    ---------------------------------------------
    welfare
    ----------------------------------------------
    --------------------------------------------*/
    .welfare_flex2{
        width: 860px;
    }
    .welfare_flex1 div,
    .welfare_flex2 div{
        width: 260px;
        height: 180px;        
        margin-bottom: 40px;
    }
    .welfare_flex1 div:first-child figure{
        width: 112px;
        height: 94px;
    }
    .welfare_flex1 div:nth-child(2) figure{
        width: 102px;
        height: 85px;
    }
    .welfare_flex1 div:nth-child(3) figure{
        width: 75px;
        height: 75px;
		margin-top: 13px;
    }
    .welfare_flex1 div:nth-child(4) figure{
        width: 80px;
        height: 76px;
		margin-top: 13px;
    } 
    .welfare_flex2 div:nth-child(1) figure{
        width: 102px;
        height: 102px;
    }
    .welfare_flex2 div:nth-child(2) figure{
        width: 78px;
        height: 82px;
    }
    .welfare_flex2 div:nth-child(3) figure{
        width: 115px;
        height: 82px;
		margin-top: 13px;
    }
	.welfare_flex2 div:nth-child(3) p{
		margin-bottom: 12px;
	}
	.welfare div figure img{
		margin-bottom: -20px;
	}
    .welfare div p{
        font-size:  1.6rem;
		margin-bottom: 10px;
    }


    
    
    /*-------------------------------------------
    ---------------------------------------------
    lead_title
    ----------------------------------------------
    --------------------------------------------*/
    .lead_title{
        margin: 160px auto 80px auto;
    }
    .lead_title h3{
        font-size: 2rem;
		margin-bottom: 10px;
    }
    .lead_title p:nth-child(2){
        font-size: 2.8rem;
        margin-bottom: 55px;
    }
    .lead_title p:nth-child(3){
        font-size: 1.6rem;
    }
}



/*-------------------------------------------
---------------------------------------------
responsive SP
----------------------------------------------
--------------------------------------------*/
@media screen and (max-width: 768px){
	.sub_mv .container{
		flex-direction: column;
		height: unset;
		padding: 0
	}
	.sub_mv_txt{
		position: relative;
		padding-left: 20px;
	}
	.sub_mv .sub_mv_txt h2{
		font-size: 3.5rem;
		padding-top: 29px;
	}
	.sub_mv .sub_mv_txt p{
		font-size: 1.6rem;
	}
	.sub_mv .sub_mv_txt ul{
		font-size: 1.4rem;
		margin: 20px 0 10px 0;
	}
	.sub_mv .sub_mv_txt ul li{
		margin-right: 20px;
	}
	.sub_mv .sub_mv_txt ul li a::after{
		height: 7px;
		width: 7px;
		right: -9px;
	}
	.sub_mv .sub_mv_txt::after{
		right: 0;
		transform: unset;
	}
	.sub_mv .container .sub_mv_img{
		position: relative;
	}
	.sub_mv .container .sub_mv_img figure{
		width: 100%;
		height: 100%;
	}
	h3{
		font-size: 3rem;
	}
	.link_arrow {
		width: 170px;
		height: 45px;
	}
	
	.link_arrow, .link_new_window{
		font-size: 1.3rem;
	}
	.link_arrow::after{
		height: 10px;
    	width: 10px;
		right: 13px;
	}
	.link_new_window::after{
		height: 15px;
		width: 11px;
		right: 11px;
	}
    
	.welfare div p{
		font-size: 13px;
	}
    .welfare_flex1 div,
    .welfare_flex2 div{
        width: 48%;
        max-width: 260px;
        height: 125px;
    }
    .welfare_flex1{
        justify-content: space-around;
    }
	.welfare_flex2{
        flex-wrap: wrap;
        width: unset;
        justify-content: space-around;
    }
    .lead_title h3{
        font-size: 1.5rem;
		margin-bottom: 5px;
    }
    .lead_title p:nth-child(2){
        font-size: 1.6rem;
    }
    .lead_title p:nth-child(3){
        font-size: 1.4rem;
		text-align: left;
    }
    .welfare_flex1 div:first-child figure,
    .welfare_flex1 div:nth-child(2) figure,
    .welfare_flex1 div:nth-child(3) figure,
    .welfare_flex1 div:nth-child(4) figure,
    .welfare_flex2 div:nth-child(1) figure,
    .welfare_flex2 div:nth-child(2) figure,
    .welfare_flex2 div:nth-child(3) figure{
        width: 50%;
        height: 34%;
    }
}
@media (min-width: 768px) and (max-width: 1180px){
    .welfare_flex1 div, .welfare_flex2 div{
        width: calc(100vw / 1180 *260);
        height: calc(100vw /1180 * 180);
    }
    .welfare_flex2{
        width: calc(100vw / 1180 *860);
    }
    .welfare_flex1 div:first-child figure{
        width: calc(100vw / 1180 *112);
        height: calc(100vw / 1180 * 94);
    }
    .welfare_flex1 div:nth-child(2) figure{
        width: calc(100vw / 1180 *102);
        height: calc(100vw / 1180 *85);
    }
    .welfare_flex1 div:nth-child(3) figure{
        width: calc(100vw / 1180 *75);
        height: calc(100vw / 1180 *75);
    }
    .welfare_flex1 div:nth-child(4) figure{
        width: calc(100vw / 1180 *80);
        height: calc(100vw / 1180 *76);
    } 
    .welfare_flex2 div:nth-child(1) figure{
        width: calc(100vw / 1180 *102);
        height: calc(100vw / 1180 *102);
    }
    .welfare_flex2 div:nth-child(2) figure{
        width: calc(100vw / 1180 *78);
        height: calc(100vw / 1180 *82);
    }
    .welfare_flex2 div:nth-child(3) figure{
        width: calc(100vw / 1180 *115);
        height: calc(100vw / 1180 *82);
    }
    .welfare div p{
        font-size: calc(100vw / 1180 *16);
    }
}