@charset "utf-8";
/* ------------------------------------------------------------
ホーム
------------------------------------------------------------ */
/* 共通
---------------------------------------------- */
/*--h1--*/ 
h1{color:#FFFFFF;}
/* base へ移動？？
---------------------------------------------- */
@media print, screen and (max-width: 767px){
}

/* HOME共通
---------------------------------------------- */
@media print, screen and (max-width: 1200px){
}
@media print, screen and (max-width: 767px){
}

/* プロモーション
---------------------------------------------- */
div#wrap_swiper{width: 100%;height: 740px;position: relative;}
.swiper-container {width: 100%;height: 740px;overflow: hidden;color:#FFF;}
.swiper-slide {position: relative;display: flex;justify-content: center;align-items: center;}
.swiper-slide img {width: 100vw; /* 画像の幅をビューポートの幅に設定 */height: 740px;object-fit: cover; /* 画像がはみ出すようにカバー */}
#promotion_caption {position: absolute;left: 20px;bottom: 310px;font-size: 44px;font-weight: 700;z-index: 333;color: #FFFFFF;letter-spacing: 0.1em;}
#promotion_caption li {background: #0068A5;padding: 20px 40px 16px;border-radius: 60px;line-height: 1.0;display: table;}
#promotion_caption li:last-child{background: #00A4E3;margin-top: 20px;}

@media print, screen and (max-width: 900px){
}

@media print, screen and (max-width: 900px){
div#wrap_swiper{height: auto;padding-top: 75px;}
.swiper-container {width: 100%;height: 330px;overflow: visible;}
.swiper-slide img {height: 330px;}
#promotion_caption {left: 20px;bottom: 20px;font-size: 22px;}
#promotion_caption li {padding: 10px 20px 6px;}
#promotion_caption li:last-child{margin-top: 10px;}
}

/* Main Content
---------------------------------------------- */
div#home_main_bg{background-image: linear-gradient(#ffffff, #e1edf4 61%);padding: 140px 0 130px;}
section#home_main_content{max-width: 1240px;margin: 0 auto;padding:0 20px;}
ul#home_main_list{ display: grid;grid-template-columns: repeat(3, 1fr);gap: 30px;}
ul#home_main_list li:first-child p.home_main_list_img{background: url(/img/main_about_on.png) no-repeat 0 0;background-size: 100%;}
ul#home_main_list li:nth-child(2) p.home_main_list_img{background: url(/img/main_service_on.png) no-repeat 0 0;background-size: 100%;}
ul#home_main_list li:last-child p.home_main_list_img{background: url(/img/main_products_on.png) no-repeat 0 0;background-size: 100%;}
ul#home_main_list li img:hover{opacity: 0;transition: 0.3s;}

ul#home_main_list li h2{font-size: 26px;color: #0068A5;font-weight: 700;letter-spacing: 0.1em;margin: 7px 0 6px;}

@media print, screen and (max-width: 767px){
div#home_main_bg{padding: 70px 0 60px;}
section#home_main_content{max-width: 100%;margin: 0;}
ul#home_main_list{grid-template-columns: repeat(1, 1fr);gap: 40px;}
ul#home_main_list li:first-child p.home_main_list_img,
ul#home_main_list li:nth-child(2) p.home_main_list_img,
ul#home_main_list li:last-child p.home_main_list_img{background:none;}
ul#home_main_list li img:hover{opacity: 1;}

ul#home_main_list li h2{margin: 13px 0 2px;}
}

/* Topics
---------------------------------------------- */
section#topics{display: grid;grid-template-columns: 240px 1fr;gap: 60px;padding: 140px 20px;max-width: 1240px;margin: 0 auto;}
div#topics_ttl h2{color: #00A4E3;font-weight: 700;font-size: 40px;font-family: "Raleway", sans-serif;letter-spacing: 0.1em;margin: 1px 0 34px 0;}
div#topics_ttl h2 span{color: #5A6A72;font-weight: 600;font-size: 16px;display: block;letter-spacing: 0.05em;margin: 0 0 -7px;line-height: 1.0;}
div#topics_ttl p.link_arw_blu{font-weight: 700;line-height: 1.0;}
div#topics_ttl p.link_arw_blu img{width: 40px;height: 24px;margin-right: 10px;}
div#topics_ttl p.link_arw_blu span{padding: 5px 0 0;}
div#topics_ttl p.link_arw_blu:hover{color: #00A3E2;}

@media print, screen and (max-width: 900px){
}

@media print, screen and (max-width: 900px){
section#topics{grid-template-columns:1fr;gap: 50px;padding: 70px 20px;max-width: 100%;margin: 0;}
div#topics_ttl h2{margin: 1px 0 14px 0;}
div#topics_ttl h2 span{font-size: 15px;margin: 0 0 -8px;}
div#topics_ttl p.link_arw_blu img{width: 35px;height: 21px;margin-right: 10px;}
div#topics_ttl p.link_arw_blu span{padding: 2px 0 0;}
}