@charset "UTF-8";
/*--------------------------------------------------------------------------

	TOPページ

--------------------------------------------------------------------------*/
/*---------- 共通設定 ----------*/
.top_box { background: rgba(231, 234, 231, 0.7); }

/*--------------------------------------------------------------------------
	メイン表示部
--------------------------------------------------------------------------*/
#top_main.bg_fixed::before { background: url("../../img/corp_bg_topmain01.jpg") no-repeat center top; background-size: 2000px auto; }

/*---------- メインテーマ ----------*/
.top_theme { padding: 90px 10px 150px 10px; }
.top_theme .frm { margin: 0 auto; padding: 100px 10px; background: rgba(231, 234, 231, 0.7); max-width: 700px; }
.top_theme .frm h2 { text-align: center; }
.top_theme .frm h2 img { max-width: 520px; }

/*---------- TOPICS ----------*/
.top_topics { padding: 0 10px; }
.top_topics .top_topics_frm { margin: 0 auto 100px auto; padding: 40px 20px 10px 20px; background: #fff; max-width: 1100px; border: 1px solid #1d61ae; }
.top_topics .top_topics_frm .sbj { margin: 0 auto 20px auto; display: flex; display: -webkit-flex; align-items: center; -webkit-box-align: center; max-width: 1020px; }
.top_topics .top_topics_frm .sbj h2 { padding: 0 0 0 10px; flex: 1; -webkit-flex: 1; line-height: 1; font-size: 32px; font-weight: 400; letter-spacing: 0.16em; }
.top_topics .top_topics_frm .sbj h2 span.gf_rb { padding: 0 20px 0 0; display: inline-block; background: url("../img/ic_arrow01_r_bl01.png") no-repeat right center; background-size: 6px auto; }
.top_topics .top_topics_frm .sbj h2 a:link, .top_topics .top_topics_frm .sbj h2 a:visited { color: #1d61ae; }
.top_topics .top_topics_frm .sbj h2 a:active, .top_topics .top_topics_frm .sbj h2 a:hover { opacity: 0.7; }
.top_topics .top_topics_frm .sbj p { width: 140px; }
.top_topics .top_topics_frm .sbj p a { display: block; width: 100%; font-size: 13px; text-align: center; }
.top_topics .top_topics_frm .sbj p a:link, .top_topics .top_topics_frm .sbj p a:visited { color: #fff; background: #333; }
.top_topics .top_topics_frm .sbj p a:active, .top_topics .top_topics_frm .sbj p a:hover { opacity: 0.7; }
.top_topics .top_topics_frm .page_sub_menu.select { margin: 0 auto; padding: 0 0 20px 0; border-bottom: 1px solid #1d61ae; max-width: 1020px; }
.top_topics .top_topics_frm .page_sub_menu.select ul { justify-content: flex-start; -webkit-box-pack: start; }
.top_topics .top_topics_frm .page_sub_menu.select ul li { padding: 0 10px; max-width: 183px; }
.top_topics .top_topics_frm .page_sub_menu.select ul li a { padding: 2px 10px; font-size: 13px; }
.top_topics .top_topics_frm .post_list { margin: 0 auto; max-width: 1020px; }
.top_topics .top_topics_frm .post_list .frm .post_list_item { padding: 25px 0 15px 0; border-bottom: 1px solid #c4c4c4; }
.top_topics .top_topics_frm .post_list .frm .post_list_item:last-of-type { border-bottom: none; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a, .top_topics .top_topics_frm .post_list .frm .post_list_item div.none_post { display: table; width: 100%; table-layout: fixed; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a .ymd, .top_topics .top_topics_frm .post_list .frm .post_list_item a .data, .top_topics .top_topics_frm .post_list .frm .post_list_item div.none_post .ymd, .top_topics .top_topics_frm .post_list .frm .post_list_item div.none_post .data { display: table-cell; vertical-align: top; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a .ymd, .top_topics .top_topics_frm .post_list .frm .post_list_item div.none_post .ymd { width: 108px; font-size: 15px; letter-spacing: 0.06em; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a .data h3, .top_topics .top_topics_frm .post_list .frm .post_list_item div.none_post .data h3 { font-size: 15px; font-weight: 500; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a .data .sub_title, .top_topics .top_topics_frm .post_list .frm .post_list_item div.none_post .data .sub_title { background: #e6e6dc; margin-top: 15px; padding: 15px 20px 10px; font-size: 14px; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a:active, .top_topics .top_topics_frm .post_list .frm .post_list_item a:hover { opacity: 0.75; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a:active .ymd p, .top_topics .top_topics_frm .post_list .frm .post_list_item a:hover .ymd p { color: #333; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a:active .data h3, .top_topics .top_topics_frm .post_list .frm .post_list_item a:hover .data h3 { color: #333; }
.top_topics .top_topics_frm .post_list .frm .post_list_item a:active .data ul li.type_bms, .top_topics .top_topics_frm .post_list .frm .post_list_item a:active .data ul li.type_sub, .top_topics .top_topics_frm .post_list .frm .post_list_item a:hover .data ul li.type_bms, .top_topics .top_topics_frm .post_list .frm .post_list_item a:hover .data ul li.type_sub { color: #333; }

/*---------- バナー ----------*/
.top_box.bn { margin: 0 auto 130px auto; padding: 100px 10px; }

.top_bn { margin: 0 auto; max-width: 1200px; }
.top_bn ul { display: flex; display: -webkit-flex; width: 100%; }
.top_bn ul li { padding: 0 20px; width: 50%; }
.top_bn ul li a { display: block; overflow: hidden; }
.top_bn ul li a img { display: block; transition-duration: 0.5s; }
.top_bn ul li a img:hover { transform: scale(1.05, 1.05); transition-duration: 0.5s; }
.top_bn + .top_event { margin: 150px auto 0 auto; max-width: 1200px; }

/*---------- イベント・セミナー情報 ----------*/
.top_event { margin: 0 auto; max-width: 1200px; }
.top_event h2 { margin: 0 0 50px auto; line-height: 70px; color: #fff; background: #1d61ae; font-size: 32px; font-weight: 700; text-align: center; }
.top_event .list { display: flex; display: -webkit-flex; flex-wrap: wrap; }
.top_event .list.post_one > a { width: 100%; }
.top_event .list.post_one > a .item { display: flex; display: -webkit-flex; }
.top_event .list.post_one > a .item .sort { width: 50%; }
.top_event .list.post_one > a .item .data { padding: 0 0 0 50px; width: 50%; }
.top_event .list > a { margin: 0 20px; padding: 40px 40px 35px 40px; border: 1px solid #1d61ae; width: calc(50% - 40px); background: #fff; border-radius: 20px; }
.top_event .list > a:nth-of-type(n+3) { margin: 40px 20px 0 20px; }
.top_event .list > a:active, .top_event .list > a:hover { opacity: 0.7; }
.top_event .list > a:active .item .sort h3, .top_event .list > a:hover .item .sort h3 { color: #333; }
.top_event .list > a:active .item .data dl dd, .top_event .list > a:hover .item .data dl dd { color: #333; }
.top_event .list > a .item .sort p { margin: 0 0 5px 0; padding: 0 0 0 15px; border-left: 3px solid #0e3054; line-height: 20px; font-size: 15px; }
.top_event .list > a .item .sort ul { line-height: 0; font-size: 0; }
.top_event .list > a .item .sort ul li { margin: 10px 10px 0 0; display: inline-block; line-height: 20px; font-size: 13px; }
.top_event .list > a .item .sort ul li.cat_sub { min-width: 225px; }
.top_event .list > a .item .sort ul li.join_target { padding: 0 5px 0; }
.top_event .list > a .item .sort h3 { margin: 5px 0 10px 0; font-size: 20px; font-weight: 700; }
.top_event .list > a .item .data dl { margin: 10px 0 0 0; display: table; table-layout: fixed; }
.top_event .list > a .item .data dl:first-of-type { margin: 0; }
.top_event .list > a .item .data dl dd, .top_event .list > a .item .data dl dd { display: table-cell; vertical-align: top; }
.top_event .list > a .item .data dl dt { width: 100px; color: #fff; background: #888686; font-size: 14px; text-align: center; }
.top_event .list > a .item .data dl dd { padding: 0 0 0 20px; font-size: 14px; }
.top_event .list > a .item .data dl dd .check { display: block; color: #cc0000; }

/*---------- 工務店・ビルダー様へ、製品・サービスのご案内 ----------*/
.top_business { margin: 0 0 150px 0; }
.top_business .frm { padding: 0 10px; display: flex; width: 100%; max-width: 1200px; }
.top_business .frm .item:hover { opacity: 0.7; }
.top_business .frm .item a h2 { margin: 0 0 40px 0; line-height: 1.4; font-size: 36px; font-weight: 500; text-align: center; }
.top_business .frm.builder { margin: 0 auto 0; }
.top_business .frm.builder .item { padding: 75px 80px 90px 80px; background: #1d61ae; max-width: 600px; }
.top_business .frm.builder .item a h2, .top_business .frm.builder .item a p { color: #fff; }
.top_business .frm.product { justify-content: flex-end; margin: 0 auto 0; }
.top_business .frm.product .item { padding: 75px 80px 70px 80px; background: #e7eae7; max-width: 700px; }
.top_business .frm.product .item a:link h2, .top_business .frm.product .item a:visited h2, .top_business .frm.product .item a:active h2, .top_business .frm.product .item a:hover h2 { color: #1d61ae; }
.top_business .frm.product .item a:link p, .top_business .frm.product .item a:visited p, .top_business .frm.product .item a:active p, .top_business .frm.product .item a:hover p { color: #333; }
.top_business .cap { margin: 150px auto; padding: 55px 10px 50px 10px; background: #0e3054; text-align: center; }
.top_business .cap p { margin: 0 auto; color: #fff; max-width: 1100px; }
.top_business .cap p:first-of-type { margin: 0 auto 20px auto; line-height: 1.4; color: #66ccff; font-size: 36px; letter-spacing: 0.1em; }

/*---------- サービス ----------*/
.top_service2 { padding: 120px 10px 110px 10px; background: #0e3054; }
.top_service2 .frm { margin: 0 auto; max-width: 960px; }
.top_service2 .frm a { display: -webkit-flex; display: flex; padding: 0; }
.top_service2 .frm a .ph { width: 100%; max-width: 420px; }
.top_service2 .frm a .cap { padding: 0 0 0 60px; width: 100%; }
.top_service2 .frm a .cap h2 { margin: 0 0 20px 0; line-height: 1.6; font-size: 24px; font-weight: 500; letter-spacing: 0.08em; }
.top_service2 .frm a .cap p { line-height: 1.8; font-size: 14px; }
.top_service2 .frm a:link .cap h2, .top_service2 .frm a:visited .cap h2 { color: #66ccff; }
.top_service2 .frm a:link .cap p, .top_service2 .frm a:visited .cap p { color: #fff; }
.top_service2 .frm a:active .cap h2, .top_service2 .frm a:active .cap p, .top_service2 .frm a:hover .cap h2, .top_service2 .frm a:hover .cap p { opacity: 0.7; }

/*# sourceMappingURL=top.css.map */
