@charset "utf-8";
#main_image_wrap{ position:relative;}
#main_image{ position:relative; width:100%;}
#main_image .unit{ position:relative; width:100%; height:100%;}
#main_image img{ object-fit:cover; width:100%; height:100%;}
#main_text{ top:40%; left:0; width:100%; opacity:1;}
#main_text .main_text_wrap{ display:inline-block; background:linear-gradient(to right, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%);}
#main_text h2{ font-weight:500; letter-spacing:0.1em; line-height:160%;}
#main_text h2 > span{ font-size:1.45em; letter-spacing:0.1em;}
#main_text ._l, #main_text ._l2{ display:inline-block; position:relative;}
#main_text ._l:before, #main_text ._l2:before{ content:""; position:absolute; bottom:-5px; left:0; width:0; height:20px;}
#main_text ._l:before{ background:rgba(255,101,123,0.15); transition:all 1s 0.3s;}
#main_text ._l2:before{ background:rgba(26,177,159,0.15); transition:all 1s 0.1s;}
#main_text.plx_on ._l:before, #main_text.plx_on ._l2:before{ width:100%;}
@media (max-width: 575px){
	#main_image{ height:125vw; max-height:500px;}
	#main_text{ transform:none; top:10vw;}
	#main_text .main_text_wrap{ padding:30px 10px;}
	#main_text h2{ font-size:1.75em; margin-bottom:10px; font-weight:bold;}
}
@media (min-width: 576px) and (max-width: 767px){
	#main_image{ height:115vw; max-height:730px;}
	#main_text{ transform:none; top:10vw;}
	#main_text .main_text_wrap{ padding:40px 20px;}
	#main_text h2{ font-size:2.25em; margin-bottom:20px;}
}
@media (min-width: 768px) and (max-width: 991px){
	#main_image{ height:50vw;}
	#main_text{ padding-bottom:0px; top:0; transform:none;}
	#main_text .main_text_wrap{ padding:30px 20px;}
	#main_text h2{ font-size:2em; margin-bottom:10px;}
}
@media (min-width: 992px){ #main_image{ height:45vw;} }
@media (min-width: 992px) and (max-width:1199px){
	#main_text{ padding-bottom:4vw;}
	#main_text .main_text_wrap{ width:700px; padding:40px 20px;}
	#main_text h2{ font-size:2em; margin-bottom:20px;}
}
@media (min-width:1200px){
	#main_text .main_text_wrap{ padding:50px 150px 50px 80px;}
	#main_text h2{ font-size:2.5em; margin-bottom:20px;}
}
#top_main_search{ position:relative;}
#top_main_search .box{ border-radius:10px;}
#top_main_search .title{ font-weight:bold; margin-bottom:15px; font-size:1.35em;}
#top_main_search .button{ text-align:center; background:#56aaa0; color:#fff; border-radius:10px; padding:10px 0; width:100%; margin-bottom:10px; font-size:0.8em;}
#top_main_search .button._bg2{ background:#698fa6;}
#top_main_search .button._bg3{ background:#76a669;}
#top_main_search .button._bg4{ background:#a1a669;}
#top_main_search .button._bg5{ background:#a66969;}
@media (max-width: 575px){
	#top_main_search{ margin-top:-50px;}
	#top_main_search .box{ padding:15px 15px 10px;}
}
@media (min-width: 576px) and (max-width: 767px){
	#top_main_search{ margin-top:-280px;}
	#top_main_search .box{ padding:20px; max-width:400px;}
}
@media (min-width: 768px){ #top_main_search .box{ padding:15px 30px 20px; max-width:500px;} }
@media (min-width: 768px) and (max-width: 991px){ #top_main_search{ margin-top:-50px;} }
@media (min-width: 992px) and (max-width:1299px){
	#top_main_search{ margin-top:-140px;}
	#top_main_search .box{ margin-left:10px;}
}
@media (min-width:1300px){ #top_main_search{ margin-top:-180px;} }
.top_horizontal{ position:relative;}
.top_horizontal .center{ max-width:100%;}
.top_horizontal .photo{ text-align:left;}
.top_horizontal .photo img{ object-fit:cover; width:100%; height:100%;}
.top_horizontal .title{ line-height:140%;}
@media (max-width: 575px){ .top_horizontal .title{ font-size:1.7em; margin-bottom:20px;} }
@media (min-width: 576px) and (max-width: 767px){ .top_horizontal .title{ font-size:2.25em; margin-bottom:20px;} }
@media (min-width: 768px){
	.top_horizontal .photo{ position:absolute; left:0; top:0; width:100%; height:100%;}
	#top_about .text_wrap{ margin:0 0 0 auto;}
}
@media (min-width: 768px) and (max-width: 991px){
	.top_horizontal .text_wrap{ max-width:430px; padding:30px;}
	.top_horizontal .title{ font-size:1.5em; margin-bottom:20px;}
}
@media (min-width: 992px){
	.top_horizontal .text{ padding-top:150px;}
	.top_horizontal .text_wrap{ max-width:630px; padding:50px; box-shadow:3px 3px 10px rgba(0,0,0,0.1);}
	.top_horizontal .title{ font-size:2.25em; margin-bottom:30px;}
	#top_about .photo{ padding-right:calc(50vw - 600px);}
	#top_about .text_wrap{ margin:0 0 0 auto;}
	#top_safety .photo{ padding-left:calc(50vw - 600px);}
}
@media (min-width: 992px) and (max-width:1199px){ #top_safety{ padding-bottom:0;} }
@media (min-width:1400px){ #top_safety .text{ padding-bottom:100px;} }
.top_hl_1{ font-weight:bold; text-align:center; margin-bottom:40px;}
.top_hl_1 .main:after{ content:""; display:block; margin:10px auto 0; width:80px; height:4px; background:var(--c-green);}
@media (max-width: 575px){ .top_hl_1{ font-size:1.75em;} }
@media (min-width: 576px){ .top_hl_1{ font-size:1.85em; letter-spacing:3px;} }
#top_link .top_hl_1 .main:after{ background:var(--c-pink);}
.link_unit{ position:relative;}
.link_unit a{ background:url(../image/icon/arrow2-rp.png) no-repeat right 10px center / 10px auto;}
.link_unit .photo{ width:70px; height:70px; border-radius:50%; padding:15px; background:var(--c-pink);}
.link_unit .title{ display:block; font-weight:bold; font-size:1.25em; line-height:120%;}
.link_unit .comment{ font-size:0.9em; line-height:130%;}
@media (max-width: 991px){
	#top_link .center{ padding-left:0; padding-right:0;}
	#top_link ul{ border-top:1px solid #ddd; background:var(--c-cream);}
	#top_link li{ border-bottom:1px solid #ddd;}
	.link_unit a{ display:flex; align-items:center; padding:10px;}
	.link_unit .photo{ width:70px; height:70px; border-radius:50%; padding:15px; background:var(--c-pink);}
	.link_unit .text{ padding-left:15px;}
	.link_unit .title{ margin-bottom:3px;}
	.link_unit .comment{ display:block;}
}
@media (min-width: 768px) and (max-width: 991px){
	#top_link .row{ margin:0;}
	#top_link .row > *{ padding:0;}
	#top_link li{ border-left:1px solid #ddd;}
	.link_unit a{ padding:15px 0 15px 10px;}
	.link_unit .title{ font-size:1.15em;}
	.link_unit .photo{ width:60px; height:60px; padding:12px;}
}
@media (min-width: 992px){
	.link_unit{ border:1px solid var(--c-pink);}
	.link_unit a{ display:block; padding:20px 10px 15px 10px; text-align:center;}
	.link_unit .photo{ display:block; margin:0 auto 10px;}
	.link_unit .title{ margin-bottom:10px; font-size:1.15em;}
	.link_unit .comment{ display:inline-block; text-align:left;}
}
@media (min-width: 992px) and (max-width:1099px){ .link_unit .title{ font-size:1.1em;} }
.info_unit{ background:#fff; padding:15px 15px 20px; box-shadow:3px 3px 3px rgba(0,0,0,0.1); border-radius:5px;}
.info_unit .img_wrap{ position:relative; overflow:hidden; line-height:1px;}
.info_unit .img_wrap img{ position:absolute; top:0; left:0; object-fit:cover; width:100%; height:100%;}
.info_unit .date{ font-size:0.9em;}
.info_unit .tag{ padding:3px 0; border-radius:4px; font-size:13px; width:100px;}
.info_unit .title{ line-height:130%; margin-top:5px;}
.info_blog{ margin-top:7px; font-size:0.85em; opacity:0.8; margin-bottom:20px;}
.info_blog .button{ background:url(../image/icon/arrow1-r.png) no-repeat left center / auto 0.9em; padding-left:1.25em;}
body.pc .info_unit a:hover .title{ text-decoration:underline; color:var(--c-green);}
@media (max-width: 575px){ .info_unit .img_wrap{ padding-top:100%;} }
@media (min-width: 576px){
	.info_unit .photo{ margin-bottom:10px;}
	.info_unit .img_wrap{ padding-top:62%;}
}
#top_news .top_hl_1 .main{ display:inline-block;}
#top_news .top_hl_1 .main:after{ background:var(--c-pink); margin:10px auto 0 0;}
.info_list li{ border-bottom:1px solid #ddd; padding:0 0 15px;}
.info_list li + li{ margin-top:15px;}
.info_list .tag{ padding:3px 0; border-radius:4px; font-size:13px; width:100px;}
.info_list .title{ line-height:130%;}
body.pc .info_list a:hover .title{ text-decoration:underline;}
@media (max-width: 991px){
	.info_list a{ display:block;}
	.info_list .title{ display:block; margin:0;}
}
@media (min-width: 992px){
	#top_news .top_hl_1{ margin-bottom:0;}
	.info_list a{ display:flex; align-items:baseline;}
	.info_list a > *{ display:inline-block;}
	.info_list .date{ width:100px;}
	.info_list .title{ width:calc(100% - 215px);}
}
.button._arrow1{ border-bottom:3px solid #666; padding:0 0 5px;}
.button._arrow1 > span{ background:url(../image/icon/arrow1-r.png) no-repeat right center / 13px auto; padding-right:18px;}
body.pc .button._arrow1:hover, body.pc .link_unit a:hover .button._arrow1{ border-bottom:3px solid transparent;}
