@charset "utf-8";

/* common */
img{display:inline-block; vertical-align: bottom; max-width: 100%; height: auto;}
.box{padding-top: 80px; padding-bottom: 80px; overflow:hidden; height: 100%;}
.cont_box{margin-left: 3%; margin-right: 3%; box-sizing: border-box;}
.cont{width: 1200px; min-width: 1200px; margin-left: auto; margin-right: auto;}
.hagi_main_tit{color: #20ACCA; font-size: 45px; font-weight: bold; letter-spacing: 1px; margin-bottom: 40px; position: relative; padding: 40px;}
.hagi_main_tit::before{content: ""; position: absolute; display: block; background-color: #21ADCA; width: 48px; height: 3px; top: 0px; z-index: 1;}
.hagi_main_tit::after{content: ""; position: absolute; display: block; background-color: #ddd; width: 350px; height: 1px; top: 1px; z-index: 0;}
.hagi_sub_tit{background: #666; color: #fff; font-size: 34px; font-weight: bold; margin-bottom: 30px; display: inline-block; padding: 5px 15px; line-height: 1.2;}
.hagi_s_tit{ font-size: 25px; font-weight: bold; margin-bottom: 30px;}
.hagi_s_tit::after{content: ""; display: inline-block; width: 80px; background: #ddd; height: 1px; margin-left: 10px; vertical-align: middle;}
.layout5 > *{width: 20%;}

.modaal-content-container{height: auto;}

/* =========================================================
各ページ個別メインビジュアル
========================================================= */
/* main-vis*/ 
#hagi_main-vis_wrp{ padding-top: 30px; padding-bottom: 40px;}
#hagi_main-vis{background: url("../images/main_img.jpg") no-repeat center center; background-size: cover; height: 730px; position: relative;}
#hagi_main-vis #hagi_main_title{position: absolute; bottom: 10%; left:10%;}

/* navi */
#hagi_navi ul li{border-right: 1px solid #ddd;}
#hagi_navi ul li:last-child{border-right: none;}
#hagi_navi ul li a{font-size: 18px; text-align: center; font-weight: bold; color: #333; padding: 10px 5px; display: block; position: relative;}
#hagi_navi ul li a::after{content:""; display: block; position:absolute;bottom: 5px;right:50%;width:6px;height:6px; border-top:2px solid #ddd;border-right:2px solid #ddd;transform:rotate(135deg); z-index:999; transition: 0.5s;}
#hagi_navi ul li a:hover{text-decoration: none;}
#hagi_navi ul li a:hover::after{bottom: 0;}

/* box1 */
#box1 .box1_box{background: #F7F7F7; margin-bottom: 80px; padding-bottom: 60px;}
#box1 .box1_box .why_hagi li:nth-child(1){text-align: right;}
#box1 .box1_box .why_hagi li:nth-child(2){margin-top: 50px; text-align: left;}
#box1 .box1_box .hagi_sub_tit{margin-top: -60px;}
#box1 .box1_box .box1_result{ background: #22AECA; color: #fff; text-align: center; border-radius: 5px; padding-bottom: 20px;}
#box1 .box1_box .box1_result  dl{align-items: center; }
#box1 .box1_box .box1_result  dt{background: #fff; color: #22AECA; border-radius: 5px; min-width: 150px; text-align: center; padding: 5px 10px; margin-top: -50px; display: inline-block;}
#box1 .box1_box .box1_why_box dd{padding: 15px 10px; padding: 0 5%; align-self:center;}
#box1 .box1_box .box1_why_box dl:nth-child(2n){ flex-direction: row-reverse;}

/* box2 */
#box2 .box2_box { background-color: #F2FBFD; padding: 40px 10px; margin-bottom: 60px;}
#box2 .box2_box .box2_box_main{ align-items: center;}
#box2 .box2_box .box2_box_main dd{ width: 530px;}
#box2 .box2_box .box2_point{background: #fff; padding: 0 30px 30px 30px;}
#box2 .box2_box .box2_point .box2_point_tit{ font-size: 25px; color: #22AECA; font-weight: bold; text-align: center; margin-bottom: 30px;}
#box2 .box2_box .box2_point .box2_point_tit::before{width: 50px; height: 5px; content: ""; background-color: #22AECA; display:table; margin:0 auto 20px auto;}

/* box3 */
#box3{}
#box3 .layout5 li{margin: 0;}

/* box4 */
.staff_box .staff_name span,
#box4 .staff_list .staff_name span{display: block;}

.staff_box{margin: 0 30px;}
.staff_box .staff_pop_main{ align-items: center;}
.staff_box .hagi_s_tit{font-size: 20px; margin-bottom: 20px;}


/* contact */
#box5 .hagi_contact iframe{width: 100%; height: 920px;}

/* cv_box
-----------------------------------------------*/
#cv_box{background: #fff; width: 100%; text-align: center; filter: drop-shadow(10px 10px 10px rgba(0,0,0,0.6)); position: fixed; bottom: -75px; left: 0; transition: 0.5s; opacity: 0; z-index: 10; padding: 10px 5px;}
#cv_box .cont{width: 600px;min-width:600px;}
#cv_box .link_btn {padding-top: 23px; padding-bottom: 23px;}
#cv_box .link_btn span{font-size: 25px !important;}
.upper #cv_box{ bottom: 0px; opacity: 1; }
@media only screen and (max-width :768px) {
#cv_box{padding: 5px 10px;}
#cv_box .link_btn{padding: 10px 10px;}
#cv_box .cont{margin: 0; width: 100%; min-width: inherit;}
#cv_box a {letter-spacing: 0px; width: 80%; padding: 0px; display: block; margin: 0 auto;}
#cv_box .link_btn span{font-size: 18px !important;}
}


@media screen and (max-width: 768px) {
/* common */
.box{padding-top: 40px; padding-bottom: 40px;}
.cont{width:auto; min-width:inherit; margin-left: 3%; margin-right: 3%;}
.cont_box{width: auto;}
.hagi_main_tit{font-size: 30px; letter-spacing: 0px; margin-bottom: 25px; padding: 20px;}
.hagi_main_tit::before{width: 28px;}
.hagi_main_tit::after{width: 200px;}
.hagi_sub_tit{font-size: 26px;margin-bottom: 20px;}
.hagi_s_tit{ font-size: 20px;margin-bottom: 15px;}
.hagi_s_tit::after{ width: 50px; margin-left:5px;}
.layout5 > *{width: 20% !important;}
.modaal-content-container{height:90vh;}
	/* =========================================================
	各ページ個別メインビジュアル
	========================================================= */	
/* main-vis*/ 
#hagi_main-vis_wrp{ padding-top: 15px; padding-bottom: 20px;}
#hagi_main-vis{ height: 50vh;}
#hagi_main-vis #hagi_main_title{position: absolute; bottom: 10%; left:10%;}

/* navi */
#hagi_navi ul li a{font-size: 16px; padding: 10px 5px; }

/* box1 */
#box1 .box1_box{margin-bottom: 40px; padding-bottom: 30px;}
#box1 .box1_box .why_hagi li:nth-child(2){margin-top: 25px;}
#box1 .box1_box .hagi_sub_tit{margin-top: -30px;}
#box1 .box1_box .box1_result  dt{min-width: 100px; margin-top: -30px; display: inline-block;}
#box1 .box1_box .box1_why_box dd{padding: 0 0% 30px 0%;}
#box1 .box1_box .box1_tit_box{margin-left: 3%; margin-right: 3%;}

/* box2 */
#box2 .box2_box { background-color: #F2FBFD; padding: 40px 10px; margin-bottom: 60px;}
#box2 .box2_box .box2_box_main{ align-items: center;}
#box2 .box2_box .box2_box_main dd{ width: 530px;}
#box2 .box2_box .box2_point{background: #fff; padding: 0 30px 30px 30px;}
#box2 .box2_box .box2_point .box2_point_tit{ font-size: 25px; color: #22AECA; font-weight: bold; text-align: center; text-align: center; margin-bottom: 30px;}
#box2 .box2_box .box2_point .box2_point_tit::before{width: 50px; height: 5px; content: ""; background-color: #22AECA; display:table; margin:0 auto 20px auto;}

.staff_box{margin: 0 15px;}
.staff_box .hagi_s_tit{font-size: 18px; margin-bottom: 15px;}
.staff_box .staff_pop_main{display: flex;}

} /* media */


@media screen and (max-width: 415px) {
.hagi_main_tit{line-height: 1.3;}
/* navi */
#hagi_navi ul {display: flex; align-items: center;}
#hagi_navi ul li{ width: 50%; align-self: center; line-height: 1.2;}
#hagi_navi ul li a{font-size: 14px; padding: 6px 5px 10px 5px; }
#box2 .box2_box .box2_box_main dd{width: 100%;}
.layout5 > *{width:33.3% !important;}
	.modaal-content-container{padding: 10px;}
	.staff_box .staff_pop_main{display: block;}
}