@charset "UTF-8";
/*--------------------------------------------------------------------------
	共通
--------------------------------------------------------------------------*/
#top { padding-bottom: 100px; }
#top h2.common { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
#top h2.common .eng { font-size: 60px; font-weight: 400; margin-right: 15px; }
#top h2.common .jp { font-size: 20px; font-weight: 500; margin-top: 10px; }
#top .more { display: -webkit-box; display: flex; -webkit-box-pack: end; justify-content: flex-end; }
#top .more a { display: block; width: 210px; font-size: 20px; padding: 8px 20px 10px; border: 1px solid #1c223c; background: url("../../img/more_arrow_k.png") right 10px center no-repeat; background-size: 18px auto; color: #1c223c; }
#top .more a:hover { background-color: #1c223c; background-image: url("../../img/more_arrow_w.png"); color: #FFF; }
#top .ch_btn { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; column-gap: 20px; /* 列間の間隔を設定 */ margin: 0 auto 0; padding: 0 10px 0; max-width: 1140px; }
#top .ch_btn li { height: 48px; border-radius: 24px; text-align: center; background: #FFF; border: #1c223c 1px solid; font-size: 18px; padding-top: 8px; width: 100%; max-width: 550px; cursor: pointer; }
#top .ch_btn li:hover, #top .ch_btn li.active { background: #1c223c; color: #FFF; }
#top .sw_head { max-width: 1180px; padding: 0 10px; margin: 30px auto 30px; }
#top .sw_head .btn { display: -webkit-box; display: flex; -webkit-box-pack: end; justify-content: flex-end; column-gap: 20px; }
#top .sw_head .btn div { width: 36px; height: 36px; background-position: center center; background-repeat: no-repeat; background-size: 36px; cursor: pointer; }
#top .sw_head .btn div.swiper-button-prev { background-image: url("../../img/top_plan_arrow_l_off.png"); }
#top .sw_head .btn div.swiper-button-prev:hover { background-image: url("../../img/top_plan_arrow_l_on.png"); }
#top .sw_head .btn div.swiper-button-next { background-image: url("../../img/top_plan_arrow_r_off.png"); }
#top .sw_head .btn div.swiper-button-next:hover { background-image: url("../../img/top_plan_arrow_r_on.png"); }
#top .main_area { position: relative; }
#top .main_area .slider { height: calc(100vmax - 136px); /* IE用フォールバック */ height: calc(100vh - 136px); /* フォールバック */ height: calc(-moz-available - 136px); height: calc(-webkit-fill-available - 136px); height: calc(fill-available - 136px); margin-inline: auto; overflow: hidden; width: 100%; }
#top .main_area .slider.slick-slider .slick-track .add-animation { animation: zoom 10s linear 0s normal both; }
#top .main_area .slider.slick-slider .slick-track .slick-img img { width: 100%; }
@keyframes zoom { 100% { transform: scale(1); }
  0% { transform: scale(1.2); } }
#top .historys { display: grid; grid-template-columns: 1fr 1fr; grid-template-areas: "item1 item2" "item3 item3"; column-gap: 60px; row-gap: 40px; max-width: 1120px; padding: 50px 10px 0; margin: 0 auto 0; }
#top .historys .hs_box:nth-child(1) { grid-area: item1; }
#top .historys .hs_box:nth-child(2) { grid-area: item2; }
#top .historys .hs_box:nth-child(3) { grid-area: item3; padding-top: 40px; border-top: 2px solid #cccbc9; display: grid; grid-template-columns: 87px 1fr; column-gap: 50px; }
#top .historys .hs_box:nth-child(3) article { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: start; justify-content: flex-start; row-gap: 10px; }
#top .historys .hs_box article { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; line-height: 1; margin-bottom: 20px; }
#top .historys .hs_box article h2 { font-size: 28px; font-weight: 500; }
#top .historys .hs_box article a { padding: 5px 0 10px; border-bottom: 1px solid #002065; }
#top .historys .hs_box article a:hover { border-color: #c71c2f; color: #c71c2f; }
#top .historys .hs_box .list .item a:hover { display: block; }
#top .historys .hs_box .list .item a:hover .text { text-decoration: underline; }
#top .historys .hs_box .list .item + .item { padding-top: 20px; margin-top: 15px; border-top: 1px solid #cccbc9; }
#top .historys .hs_box .list .item .data { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; line-height: 1; }
#top .historys .hs_box .list .item .data .time { font-size: 15px; font-family: 'Heebo', 'Zen Kaku Gothic New', sans-serif,'メイリオ', Meiryo, 'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro,'MS Pゴシック',serif; width: 105px; }
#top .historys .hs_box .list .item .data .contents { width: 130px; font-size: 13px; border: 1px solid #999; text-align: center; padding: 3px 0 2px; }
#top .historys .hs_box .list .item .data .city { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; font-size: 15px; background: url("../img/icon_blue_18.png") left 20px center no-repeat; background-size: 4px auto; padding-left: 35px; min-height: 18px; }
#top .historys .hs_box .list .item .data .city .eng { display: none; }
#top .historys .hs_box .list .item .data .city .jp_name { font-size: 14px; padding-top: 2px; }
#top .historys .hs_box .list .item .text { margin-top: 5px; }
#top .aeon_bn { margin-top: 100px; }
#top .aeon_bn a { width: 100%; max-width: 970px; margin: 0 auto; background: #b60081; border: #b60081 1px solid; display: -webkit-box; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
#top .aeon_bn a:hover { opacity: 0.7; }
#top .aeon_bn a > img { width: 650px; }
#top .aeon_bn a span { width: 318px; padding: 0 13px 0 15px; }
#top .aeon_bn a span img:last-child { display: none; }
#top .event { max-width: 1160px; padding: 0 10px; margin: 100px auto 0; }
#top .event h2 { margin-bottom: 35px; }
#top .event article + article { padding-top: 50px; margin-top: 50px; border-top: 1px solid #cccbc9; }
#top .event article h3 { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; background: url("../img/icon_blue.png") left center no-repeat; background-size: 4px auto; padding-left: 20px; }
#top .event article h3 .eng { font-size: 30px; font-weight: 400; margin-right: 15px; }
#top .event article h3 .jp { font-size: 19px; font-weight: 500; margin-top: 6px; }
#top .event article h3 + .list { margin-top: 30px; }
#top .event article .list { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 40px; /* 列間の間隔を設定 */ row-gap: 50px; /* 列間の間隔を設定 */ }
#top .event article .list + h3 { margin-top: 30px; }
#top .event article .list.one { max-width: 400px; grid-template-columns: repeat(1, 1fr); margin-left: auto; margin-right: auto; }
#top .event article .list a { display: block; position: relative; }
#top .event article .list a .photo { position: relative; text-align: center; overflow: hidden; }
#top .event article .list a .photo img { position: absolute; }
#top .event article .list a .type { display: block; width: 150px; font-size: 15px; font-weight: 500; text-align: center; background: #1b306a; color: #FFF; margin-top: 20px; }
#top .event article .list a .title { margin-top: 15px; }
#top .event article .list a .city { display: block; background: #FFF; color: #00000f; font-size: 14px; font-weight: 500; position: absolute; top: 0; right: 0; width: 125px; text-align: center; padding: 3px 0 3px; }
#top .event article .list a:hover .photo img { -webkit-animation: animation-hanabi 0.3s forwards linear; animation: animation-hanabi 0.3s forwards linear; position: absolute; }
@keyframes animation-hanabi { from { -ms-transform: scale(1, 1); -webkit-transform: scale(1, 1); transform: scale(1, 1); }
  to { -ms-transform: scale(1.2, 1.2); -webkit-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); } }
#top .event article .list + .more { margin-top: 30px; }
#top .works { padding: 100px 10px 70px; margin-top: 100px; background: #1c223c; }
#top .works .box { max-width: 1160px; margin: 0 auto; }
#top .works .box h2 { margin-bottom: 35px; color: #FFF; }
#top .works .box > div a:hover { opacity: 0.75; }
#top .works .box > div a img.sp { display: none; }
#top .works .box article { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 2px; /* 列間の間隔を設定 */ row-gap: 2px; /* 列間の間隔を設定 */ }
#top .works .box article a { display: block; position: relative; }
#top .works .box article a .photo { position: relative; text-align: center; overflow: hidden; }
#top .works .box article a .photo img { position: absolute; }
#top .works .box article a .image-wrapper { position: relative; width: 100%; aspect-ratio: 4 / 3; /* 400x300の比率を維持 */ overflow: hidden; background-color: #eee; display: flex; align-items: center; justify-content: center; }
#top .works .box article a .image-wrapper img { max-width: none; max-height: none; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#top .works .box article a .image-wrapper.variant-cover img { width: 100%; height: auto; min-height: 100%; object-fit: cover; /* 小さい画像をそのまま表示するための制限 */ max-width: none; max-height: none; }
#top .works .box article a .image-wrapper.variant-contain img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
#top .works .box article a span { display: none; }
#top .works .box article a:hover span { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); color: #FFF; padding: 15px; }
#top .works .box .more { margin-top: 50px; }
#top .works .box .more a { border-color: #FFF; background-image: url("../../img/more_arrow_w.png"); color: #FFF; }
#top .works .box .more a:hover { background-color: #FFF; background-image: url("../../img/more_arrow_k.png"); color: #1c223c; }
#top .estate { background: #d1d6e1; padding-bottom: 50px; }
#top .estate .es_head { background: url("../../img/top_land_back_wide.png") center center no-repeat; background-size: auto 200px; height: 200px; padding: 0 10px; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; }
#top .estate .es_head h2 { width: 100%; max-width: 1160px; margin: 0 auto; }
#top .estate .es_head + .es_box { margin-top: 30px; }
#top .estate .ch_btn { margin-top: 50px; }
#top .estate .es_box { max-width: 1180px; padding: 0 10px; margin: 0 auto 0; }
#top .estate .es_box h3 { background: url("../img/icon_blue.png") left top 10px no-repeat; background-size: 4px auto; padding: 0 0 0 15px; font-size: 24px; font-weight: 500; }
#top .estate .es_box div { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 40px; /* 列間の間隔を設定 */ row-gap: 20px; /* 列間の間隔を設定 */ margin-top: 20px; }
#top .estate .es_box div a:hover { opacity: 0.75; }
#top .estate .es_box + .es_box { margin-top: 50px; padding-top: 30px; border-top: #FFF 1px solid; }
#top .estate .area { max-width: 1180px; padding: 0 10px; margin: 60px auto 0; display: none; }
#top .estate .area.active { display: block; }
#top .estate .area .es_c_head { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; }
#top .estate .area .es_c_head h3 { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; column-gap: 15px; }
#top .estate .area .es_c_head h3 .eng { font-size: 45px; font-weight: 400; }
#top .estate .area .es_c_head h3 .jp { font-size: 18px; font-weight: 500; margin-top: 6px; }
#top .estate .area .es_c_head h3 .count { padding: 10px 15px 8px; background: #1c223c; color: #FFF; font-size: 18px; font-weight: 500; line-height: 1; }
#top .estate .area .es_c_head a { padding: 5px 0 10px; border-bottom: 1px solid #002065; min-width: 71px; }
#top .estate .area .es_c_head a:hover { border-color: #c71c2f; color: #c71c2f; }
#top .estate .area .house .list { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; column-gap: 20px; /* 列間の間隔を設定 */ margin-top: 30px; }
#top .estate .area .house .list .city { display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; max-width: 300px; text-align: center; }
#top .estate .area .house .list .city span { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; height: 50px; }
#top .estate .area .house .list .city span:nth-child(1) { background-color: #6b6d79; color: #FFF; font-size: 18px; }
#top .estate .area .house .list .city span:nth-child(2) { background-color: #FFF; font-size: 20px; }
#top .estate .area .house + .land { margin-top: 50px; padding-top: 50px; border-top: #FFF 1px solid; }
#top .estate .area .land .list { display: grid; grid-template-columns: repeat(2, 1fr); row-gap: 1px; /* 列間の間隔を設定 */ margin-top: 30px; }
#top .estate .area .land .list.one { grid-template-columns: repeat(1, 1fr); }
#top .estate .area .land .list a { background: #FFF url("../../img/top_land_arrow.png") right 20px center no-repeat; background-size: 20px auto; padding: 15px 50px 15px 70px; position: relative; }
#top .estate .area .land .list a:hover { color: #c61e2f; }
#top .estate .area .land .list a .new { position: absolute; width: 40px; left: 17px; top: calc(50% - 10px); }
#top .plan { padding: 90px 0 0; }
#top .plan .common { max-width: 1180px; padding: 0 10px; margin: 0 auto 0; }
#top .plan .ch_btn { margin-top: 30px; }
#top .plan .swiper_plan { content-visibility: hidden; opacity: 0; transition: opacity 1s ease; }
#top .plan .swiper_plan.active { content-visibility: visible; opacity: 1; }
#top .plan .swiper_plan .swiper-wrapper a .photo { position: relative; overflow: hidden; text-align: center; }
#top .plan .swiper_plan .swiper-wrapper a .photo img { position: absolute; }
#top .plan .swiper_plan .swiper-wrapper a p { font-size: 22px; padding-top: 7px; margin-top: 10px; border-top: 1px solid rgba(28, 34, 60, 0); line-height: 1.3; }
#top .plan .swiper_plan .swiper-wrapper a:hover .photo { opacity: 0.75; }
#top .plan .swiper_plan .swiper-wrapper a:hover p { border-top: 1px solid #1c223c; }
#top .plan .swiper_plan .more { width: 100%; max-width: 1180px; padding: 0 10px 0; margin: 45px auto 0; }
#top .voice { padding: 0 10px; max-width: 1180px; margin: 100px auto 0; }
#top .voice a .sp { display: none; }
#top .voice a:hover { opacity: 0.75; }
#top .question { padding: 0 10px; margin-top: 80px; }
#top .question a { display: grid; grid-template-columns: repeat(2, 1fr); width: 100%; max-width: 1160px; margin: 0 auto; }
#top .question a:hover { opacity: 0.75; }
#top .question a .image .sp { display: none; }
#top .question a .text { display: grid; grid-template-rows: 1fr 35px; /* 1fr で残りの高さを埋める */ }
#top .question a .text .title { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; color: #FFF; height: 100%; background: #1c223c; }
#top .question a .text .title p { font-size: 24px; }
#top .question a .text .title span { margin-top: 10px; }
#top .question a .text .count { text-align: center; background: #d8c465; padding-top: 5px; }
#top .service { background: url("../../img/top_service_back.jpg") center top no-repeat; background-size: 5474px auto; padding-top: 90px; margin-top: 100px; }
#top .service .common { max-width: 1180px; padding: 0 10px; margin: 0 auto 0; }
#top .service .box { display: grid; grid-template-columns: repeat(4, 1fr); column-gap: 20px; row-gap: 20px; padding: 0 10px; margin: 100px auto 0; max-width: 1600px; }
#top .service .box a { position: relative; }
#top .service .box a span { position: absolute; top: 0; left: 0; padding: 15px; color: #FFF; width: 100%; height: 100%; background: rgba(70, 70, 70, 0.5); font-size: 18px; }
#top .service .box a:hover { opacity: 0.75; }
#top .service .box a:hover span { color: #00000f; background: rgba(255, 255, 255, 0.5); }
#top .blog { background: url("../../img/top_blog_back.jpg") center top no-repeat; background-size: 2220px auto; padding: 80px 0 0 0; margin-top: 100px; }
#top .blog .blog_main { margin-left: calc(50% + -310px); max-width: 900px; padding: 0 10px; }
#top .blog .blog_main .blogs { padding: 35px 0 0 0; margin: 40px 0 0 0; border-top: 1px solid #cccbc9; }
#top .blog .blog_main .blogs h3 { font-size: 27px; font-weight: 500; }
#top .blog .blog_main .blogs article { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 40px; margin-top: 20px; }
#top .blog .blog_main .blogs article a .photo { position: relative; overflow: hidden; text-align: center; }
#top .blog .blog_main .blogs article a .photo img { position: absolute; }
#top .blog .blog_main .blogs article a:hover { opacity: 0.75; }
#top .blog .blog_main .blogs article.const a .date { margin-top: 10px; display: block; }
#top .blog .blog_main .blogs article.const a h4 { text-align: center; font-size: 15px; font-weight: 500; background: #1c223c; color: #FFF; margin-top: 5px; }
#top .blog .blog_main .blogs article.const a .sub { font-size: 18px; display: block; }
#top .blog .blog_main .blogs article.sblog a .data { display: grid; grid-template-columns: 60px 1fr; column-gap: 20px; margin-top: 20px; }
#top .blog .blog_main .blogs article.sblog a .data .box .name { border-top: 1px solid #cccbc9; padding-top: 5px; margin-top: 5px; }
#top .blog .blog_main .blogs article.sblog a h4 { font-size: 15px; font-weight: 500; margin-top: 5px; }
#top .blog .blog_main .blogs .more { margin-top: 30px; }

/*--------------------------------------------------------------------------
	ポータル
--------------------------------------------------------------------------*/
#top.portal .concept { padding: 0 10px; margin-top: 50px; background: url("../../img/top_concept_back.jpg") center center no-repeat; background-size: 2220px auto; height: 940px; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; }
#top.portal .concept section { color: #FFF; width: 100%; max-width: 1160px; }
#top.portal .concept section h2 { font-size: 60px; font-weight: 400; }
#top.portal .concept section h3 { font-size: 32px; font-weight: 500; margin-top: 30px; }
#top.portal .concept section p { width: 100%; max-width: 580px; font-size: 16px; }
#top.portal .concept section a { display: block; width: 180px; font-size: 20px; padding: 8px 10px 10px; border: 1px solid #FFF; background: url("../../img/more_arrow_w.png") right 10px center no-repeat; background-size: 18px auto; color: #FFF; margin-top: 40px; }
#top.portal .concept section a:hover { background-color: #FFF; background-image: url("../../img/more_arrow_k.png"); color: #1c223c; }
#top.portal .image_area { margin-top: 60px; }
#top.portal .image_area .slider { width: 100%; max-width: 1160px; margin: 0 auto; }
#top.portal .image_area .slider .slick-list .slick-track .slick-slide { height: auto; }
#top.portal .image_area .slider .slick-dots { position: static; display: -webkit-box; display: flex; column-gap: 10px; padding: 10px 0 0 0; }
#top.portal .image_area .slider .slick-dots li { width: 100%; max-width: 100px; margin: 0; height: inherit; }
#top.portal .image_area .slider .slick-dots li button { width: 100%; height: 3px; padding: 0; margin: 0; background-color: #999; }
#top.portal .image_area .slider .slick-dots li button::before { content: ''; }
#top.portal .image_area .slider .slick-dots li.slick-active button { background-color: #1b306a; }
#top.portal .chumon { margin-top: 100px; }
#top.portal .chumon a { display: block; padding: 0 10px; background-position: center center; background-repeat: no-repeat; background-size: 2220px auto; }
#top.portal .chumon a.hokkaido { background-image: url("../../img/p_top_ho.jpg"); }
#top.portal .chumon a.fukuoka { background-image: url("../../img/p_top_fu.jpg"); }
#top.portal .chumon a.other { background-image: url("../../img/p_top_dh.jpg"); }
#top.portal .chumon a.other article div span:nth-child(2) { background: url("../../img/p_top_dh_link.png") right center no-repeat; background-size: 25px auto; padding-right: 35px; }
#top.portal .chumon a:hover article div { background: #1c223c; }
#top.portal .chumon a + a { margin-top: 50px; }
#top.portal .chumon a article { max-width: 1160px; height: 350px; margin: 0 auto; display: -webkit-box; display: flex; -webkit-box-pack: end; justify-content: flex-end; -webkit-box-align: center; align-items: center; }
#top.portal .chumon a article div { width: 400px; height: 200px; background: #4d4d4d; color: #FFF; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; text-align: center; }
#top.portal .chumon a article div span:nth-child(1) { width: 100px; font-size: 30px; font-weight: 400; border-bottom: 1px solid #FFF; margin-bottom: 10px; padding-bottom: 20px; }
#top.portal .chumon a article div span:nth-child(2) { font-size: 27px; font-weight: 500; }
#top.portal .chumon a:nth-child(even) article { -webkit-box-pack: start; justify-content: flex-start; }
#top.portal .image_area02 { background-image: url("../../img/top_img_works.jpg"); background-position: center top; background-repeat: no-repeat; background-size: auto 400px; height: 400px; width: 100%; margin-top: 100px; }
#top.portal .comp { margin-top: 100px; }
#top.portal .comp .common { max-width: 1180px; padding: 0 10px; margin: 0 auto 0; }
#top.portal .comp .box { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 40px; row-gap: 35px; padding: 0 10px; max-width: 1180px; margin: 40px auto 0; }
#top.portal .comp .box a { text-align: center; }
#top.portal .comp .box a div { position: relative; }
#top.portal .comp .box a div span { position: absolute; width: 100%; height: 100%; border: 5px #002065 solid; display: none; top: 0; left: 0; }
#top.portal .comp .box a:hover div span { display: block; }
#top.portal .comp .box a > span { display: block; }
#top.portal .comp .box a > span.eng { font-size: 25px; margin-top: 15px; }

/*--------------------------------------------------------------------------
	エリアトップ共通
--------------------------------------------------------------------------*/
#top.area .main_area .slider { height: calc(100vmax - 182px); /* IE用フォールバック */ height: calc(100vh - 182px); /* フォールバック */ height: calc(-moz-available - 182px); height: calc(-webkit-fill-available - 182px); height: calc(fill-available - 182px); }
#top.area .main_area .tx { position: absolute; width: 330px; height: 330px; top: calc(50% - 165px); left: calc(50% - 165px); display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; background-color: rgba(28, 34, 60, 0.8); color: #FFF; }
#top.area .main_area .tx h2 { font-size: 50px; font-weight: 400px; }
#top.area .main_area .tx p { width: 220px; font-size: 20px; font-weight: 500; border-top: #FFF 2px solid; padding-top: 20px; margin-top: 20px; text-align: center; }
#top.area .service .box { grid-template-columns: repeat(3, 1fr); max-width: 1180px; }

/*--------------------------------------------------------------------------
	エリアトップ 北海道
--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
	エリアトップ 福岡
--------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------
	OTHERTOP
--------------------------------------------------------------------------*/
#top.other .area_map { background-image: url("../../dual-home/img/img_dual.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; /* 高さに収める */ padding: 125px 10px 65px; }
#top.other .area_map .contents { width: 100%; max-width: 790px; position: relative; margin: 0 auto; }
#top.other .area_map .contents .tx { top: calc(50% - 85px); position: absolute; }
#top.other .area_map .contents .tx .sp { display: none; }
#top.other .information { padding: 0 10px 0; max-width: 1160px; margin: 40px auto 0; }
#top.other .information article { text-align: center; border-bottom: 1px solid #cccbc9; padding: 0 0 15px; }
#top.other .information article img { max-width: 550px; margin: 20px auto 0; }
#top.other .information article div { font-size: 23px; margin-top: 50px; }
#top.other .information .ym { width: 100%; max-width: 790px; margin: 30px auto 0; }
#top.other .information .ym .movie { position: relative; width: 100%; padding-bottom: 56.25%; /* 16:9 のアスペクト比を維持 */ height: 0; overflow: hidden; }
#top.other .information .ym .movie iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 10px; }
#top.other .information .ym .ytcomment { text-align: center; margin-top: 10px; }
#top.other .information > p { margin: 50px auto 0; }
#top.other .information a { margin: 80px auto 0; width: 100%; max-width: 770px; display: block; }
#top.other .information a:hover { opacity: 0.75; }
#top.other .information a .sp { display: none; }

/*# sourceMappingURL=top.css.map */