@charset "utf-8"; #wrapper { max-width: 1290px; margin: auto; } @media screen and (min-width: 641px) { #wrapper { border-left: solid 1px #e2e2e2; } } /* ---------------------------------------------- ! header Elements ---------------------------------------------- */ .st-header { width: 100%; max-width: 1290px; z-index: 100; position: fixed; top: 0; height: 4px; } @media screen and (max-width: 640px) { .st-header { max-width: 640px; height: 0.9375vw; /*6px*/ } } /* ---------------------------------------------- ! sidebar Elements ---------------------------------------------- */ .st-sidebar { width: 214px; height: 200vw; padding: 17px 0 0; background-color: #fff; } .st-fcw_logo { padding: 0 17px 17px; border-bottom: solid 1px #d5d5d5; } @media screen and (max-width: 640px) { .st-sidebar { position: relative; width: 100%; height: 25vw; /*160*/ padding: 0; margin-top: 0.9375vw; /*6px*/ border-bottom: solid 0.9375vw #d5d5d5; /*6px*/ } .st-fcw_logo { width: 42.5vw; /* 272 */ padding: 5.3125vw 4.6875vw; /* 34, 30 */ border-bottom: 0; } } .st-sidebar__navigation ul { list-style-type: none; font-size: 14px; line-height: 1.4; font-weight: bold; } .st-sidebar__navigation ul li { position: relative; } .st-sidebar__navigation ul li:nth-child(1) a, .st-sidebar__navigation ul li:nth-child(2) a, .st-sidebar__navigation ul li:nth-child(5) a, .st-sidebar__navigation ul li:nth-child(6) a{ padding-top: 18px; padding-bottom: 18px; } .st-sidebar__navigation ul li:nth-of-type(4)::after, .st-sidebar__navigation ul li:nth-of-type(5)::after, .st-sidebar__navigation ul li:nth-of-type(6)::after { content: ''; position: absolute; width: 192px; height: 1px; background-color: #d5d5d5; margin: auto; bottom: 0; left: 0; right: 0; } .st-sidebar__navigation ul li a { display: block; padding: 10px; padding-left: 64px; /*letter-spacing: -0.06em;*/ background-color: #fff; transition: background-color 0.5s ease; } .st-sidebar__navigation ul li a:hover, .st-sidebar__navigation ul li a.current-page, .st-header__menu.sp ul li a.current-page { background-color: #f4f4f4; color: #999; } body.page-category-01 .st-sidebar__navigation ul li:nth-of-type(1) a, body.page-category-01 .st-header__menu.sp ul li:nth-of-type(1) a { background-color: #f4f4f4; color: #999; } body.page-category-02 .st-sidebar__navigation ul li:nth-of-type(2) a, body.page-category-02 .st-header__menu.sp ul li:nth-of-type(2) a { background-color: #f4f4f4; color: #999; } body.page-category-03 .st-sidebar__navigation ul li:nth-of-type(3) a, body.page-category-03 .st-header__menu.sp ul li:nth-of-type(3) a { background-color: #f4f4f4; color: #999; } body.page-category-04 .st-sidebar__navigation ul li:nth-of-type(4) a, body.page-category-04 .st-header__menu.sp ul li:nth-of-type(4) a { background-color: #f4f4f4; color: #999; } body.page-category-05 .st-sidebar__navigation ul li:nth-of-type(5) a, body.page-category-05 .st-header__menu.sp ul li:nth-of-type(5) a { background-color: #f4f4f4; color: #999; } body.page-category-07 .st-header__menu.sp ul li:nth-of-type(6) a { background-color: #f4f4f4; color: #999; } .st-sidebar__navigation ul li a::before { content: ''; position: absolute; display: block; width: 37px; height: 37px; background-repeat: no-repeat; background-position: center center; background-size: 100%; margin: auto; top: 0; bottom: 0; left: 17px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; } .st-sidebar__navigation ul li a.nav_icon01::before { background-image: url('../images/common/icon01.png'); } .st-sidebar__navigation ul li a.nav_icon02::before { background-image: url('../images/common/icon02.png'); } .st-sidebar__navigation ul li a.nav_icon03::before { background-image: url('../images/common/icon03.png'); } .st-sidebar__navigation ul li a.nav_icon04::before { background-image: url('../images/common/icon04.png'); } .st-sidebar__navigation ul li a.nav_icon05::before { background-image: url('../images/common/icon05.png'); } .st-sidebar__navigation ul li a.nav_icon06::before { background-image: url('../images/common/icon06.png'); } #common-search { width: 214px; padding: 10px 0; text-align: center; background-color: #fff; } #common-search form { position: relative; width: 180px; margin: 0 auto; } .searchbtn { position: absolute; width: 17px; height: 16px; margin: auto; top: 5px; left: 10px; } .searchtextbox { width: 100%; height: 27px; padding-left: 30px; } #SS_searchSubmit { display: none; } .st-logo { width: 214px; background-color: #fff; text-align: center; padding: 10px 0; } .st-logo img { width: 125px; } .st-sidebar p { font-size: 10px; color: #7d7d7d; line-height: 1.6; padding: 0 25px 30px; background-color: #fff; } @media screen and (max-width: 640px) { #js-menu-button, #js-menu-button span { display: inline-block; transition: all .4s; -webkit-transition: all .4s; box-sizing: border-box; } #js-menu-button { position: absolute; cursor: pointer; width: 16.5625vw; /*106*/ height: 16.5625vw; /*106*/ margin: auto; top: 0; bottom: 0; right: 4.6875vw; /*30*/ background-color: #e9e9e9; border-radius: 5px; } #js-menu-button::before { position: absolute; content: 'MENU'; margin: auto; left: 0; right: 0; bottom: 2.1875vw; /*14*/ text-align: center; font-size: 3.125vw; /*20*/ font-weight: bold; letter-spacing: 0.12em; color: #df0623; } #js-menu-button span { position: absolute; margin: auto; left: 0; right: 0; width: 10.9375vw; /*70*/ height: 1.5625vw; /*10*/ background-color: #df0623; border-radius: 10px; } #js-menu-button span:nth-of-type(1) { top: 2.5vw; /*16*/ -webkit-transform: rotate(0deg); transform: rotate(0deg); } #js-menu-button span:nth-of-type(2) { top: 5.625vw; /*36*/ } #js-menu-button span:nth-of-type(3) { bottom: 6.25vw; /*40*/ -webkit-transform: rotate(0deg); transform: rotate(0deg); } #js-menu-button.active span:nth-of-type(1) { top: 5.625vw; /*36*/ -webkit-transform: rotate(-315deg); transform: rotate(-315deg); } #js-menu-button.active span:nth-of-type(2) { opacity: 0; } #js-menu-button.active span:nth-of-type(3) { bottom: 9.375vw; /*60*/ -webkit-transform: rotate(315deg); transform: rotate(315deg); } #js-menu-button.active::before { content: 'CLOSE'; } #js-navigation { display: none; background-color: #fff; } .st-header__menu__inner ul { list-style-type: none; font-size: 3.75vw; /*24*/ line-height: 1.4; font-weight: bold; } .st-header__menu__inner ul li { position: relative; } .st-header__menu__inner ul li:nth-of-type(4)::after, .st-header__menu__inner ul li:nth-of-type(5)::after, .st-header__menu__inner ul li:nth-of-type(6)::after, .st-header__menu__inner ul li:nth-of-type(7)::after { content: ''; position: absolute; width: 100%; height: 1px; background-color: #d5d5d5; margin: auto; bottom: 0; left: 0; right: 0; } .st-header__menu__inner ul li a { display: table-cell; padding: 0 2.5vw 0 10.625vw; letter-spacing: -0.06em; /*16,68*/ line-height: 1; height: 13.75vw; /*88*/ vertical-align: middle; width: 100vw; } .st-header__menu__inner ul li a:hover { background-color: #f4f4f4; } .st-header__menu__inner ul li a::before { content: ''; position: absolute; display: block; width: 5.625vw; /*36*/ height: 5.625vw; /*36*/ background-repeat: no-repeat; background-position: center center; background-size: 100%; margin: auto; top: 0; bottom: 0; left: 3.125vw; /*20*/ border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; } .st-header__menu__inner ul li a.nav_icon01::before { background-image: url('../images/common/icon01.png'); } .st-header__menu__inner ul li a.nav_icon02::before { background-image: url('../images/common/icon02.png'); } .st-header__menu__inner ul li a.nav_icon03::before { background-image: url('../images/common/icon03.png'); } .st-header__menu__inner ul li a.nav_icon04::before { background-image: url('../images/common/icon04.png'); } .st-header__menu__inner ul li a.nav_icon05::before { background-image: url('../images/common/icon05.png'); } .st-header__menu__inner ul li a.nav_icon06::before { background-image: url('../images/common/icon06.png'); } .st-header__menu__inner ul li a.nav_icon07::before { background-image: url('../images/common/icon07_mc.png'); background-size: contain; } } /* ---------------------------------------------- ! contents Elements ---------------------------------------------- */ .st-contents { min-width: 1076px; margin-left: 214px; } .st-contents::before { content: ''; position: fixed; width: 4px; height: 100vh; top: 4px; background-color: rgba(0, 0, 0, 0.1); z-index: 99; } @media screen and (min-width: 641px) { .st-contents { border-right: solid 1px #e2e2e2; } } .st-contents-header__inner { width: 996px; margin: 0 40px; } .sns { float: right; padding: 26px 0 20px; overflow: hidden; } .sns:before { content: ''; display: inline-block; width: 28px; height: 28px; margin-right: 17px; float: left; background-image: url('../images/common/sns_title.png'); background-size: contain; } .st-contents-header__inner .sns a { display: inline-block; height: 28px; margin-right: 17px; float: left; } .st-contents-header__inner .sns a:nth-of-type(3) { margin-right: 0; float: right; } .st-contents-header__inner .sns a:nth-of-type(4) { margin-right: 13px; } .st-contents-header__inner .sns img { height: 100%; vertical-align: top; } .st-contents-header__inner h1 { display: inline-block; width: 78%; padding: 35px 0 0; font-size: 12px; font-weight: normal; } .st-contents__inner .st-category { position: absolute; display: table; width: 100%; height: 42px; background-color: #fff; bottom: 0; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; -o-border-radius: 0 0 5px 5px; -ms-border-radius: 0 0 5px 5px; padding: 0 10px; } .st-contents__inner .st-category p { position: relative; margin: 0 !important; font-size: 11px !important; line-height: 1; padding: 15.5px 0 15.5px 28px; letter-spacing: -0.03em; } .st-contents__inner .st-category p::before { content: ''; position: absolute; display: block; width: 22px; height: 22px; background-repeat: no-repeat; background-position: center center; background-size: contain; margin: auto; top: 0; bottom: 0; left: 0px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; } .st-contents__inner .st-category p { display: table-cell; vertical-align: middle; border-top: 1px solid #dadada; } .st-contents__inner .st-category p.color01::before { background-image: url('../images/common/icon01.png'); } .st-contents__inner .st-category p.color02::before { background-image: url('../images/common/icon02.png'); } .st-contents__inner .st-category p.color03::before { background-image: url('../images/common/icon03.png'); } .st-contents__inner .st-category p.color04::before { background-image: url('../images/common/icon04.png'); } .st-contents__inner .st-category p.color05::before { background-image: url('../images/common/icon05.png'); } .st-contents__inner .st-category p.color07::before { background-image: url('../images/common/icon07_mc.png'); } .st-contents__inner { width: 996px; margin: 0 40px; } @media screen and (max-width: 640px) { .st-contents { min-width: initial; min-height: auto; margin-left: 0; padding-top: 25.9375vw; /*166*/ } .st-contents::before { content: none; } .st-contents-header { min-height: auto; padding-bottom: 1.5625vw; /*10*/ padding-top: 4.375vw; /*28*/ } .st-contents-header__inner { width: 100%; margin: 0; } .st-contents__inner { width: 100%; margin: 0; } .st-contents__inner .st-category { height: 0; min-height: 10vw; /*64*/ padding: 0 3.125vw; /*20*/ } .st-contents__inner .st-category p { padding: 1.25vw 0 1.25vw 5.3125vw; /*8,8,34*/ font-size: 3.125vw !important; /*20*/ line-height: 1.2; } .st-contents__inner .st-category p::before { width: 4.0625vw; /*26*/ height: 4.0625vw; /*26*/ } } /* ---------------------------------------------- ! business Elements ---------------------------------------------- */ .st-business { padding-bottom: 80px; line-height: 1; } .st-business_title { position: relative; width: 996px; border-bottom: 6px solid #df0623; } .st-business_title:hover { cursor: pointer; } .st-business_title__inner { border-bottom: 56px solid #fff; border-left: 0px solid transparent; border-right: 70px solid transparent; margin-right: 190px; height: 0; } .st-business_title__inner h2 { font-size: 20px; padding: 18px 0px 18px 65px; letter-spacing: -0.07em; /* white-space: nowrap; */ } .st-business_title__inner h2::before { content: ''; position: absolute; display: block; width: 37px; height: 37px; background-image: url('../images/common/icon06.png'); background-repeat: no-repeat; background-position: center center; background-size: 100%; margin: auto; top: 0; bottom: 0; left: 17px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; } .accordion { position: absolute; width: 26px; height: 26px; margin: auto; top: 0; bottom: 0; right: 0; } .accordion::before, .accordion::after { content: ''; position: absolute; background-color: #fff; margin: auto; top: 0; bottom: 0; left: 0; right: 0; } .accordion::before { width: 4px; height: 16px; transform: rotateZ( 0deg); -webkit-transition: transform 0.3s ease; transition: transform 0.3s ease; } .accordion::after { width: 16px; height: 4px; transform: rotateZ( 0deg); -webkit-transition: transform 0.3s ease; transition: transform 0.3s ease; } .accordion.active.close::before { transform: rotateZ( 90deg); } .accordion.active.close::after { transform: rotateZ( 360deg); } .st-business_contents { display: none; background-color: #fff; padding: 30px 36px 20px; } .st-business_contents h3 { margin: 0 !important; padding: 0 !important; font-size: 18px !important; line-height: 1 !important; border-left: none !important; clear: both; } .st-business_contents h4 { margin: 30px 0 20px !important; padding: 0 !important; font-size: 16px !important; font-weight: normal !important; line-height: 1 !important; border-left: none !important; clear: both; } .st-business_box { padding-bottom: 10px; border-bottom: solid 1px #dadada; display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .st-business_box a { position: relative; float: left; width: 226px; margin: 0 5px 30px 0; text-decoration: none !important; } .st-business_box a:hover { text-decoration: underline !important; } .st-business_box .btn-business img { transition: opacity 0.5s ease; } .st-business_box .btn-business:hover img { opacity: 0.6 filter: alpha(opacity=60); -ms-filter: alpha(opacity=60); } .st-business_box a:nth-of-type(4n) { margin-right: 0; } .st-business_box a span.cap { display: table-cell; height: 60px; vertical-align: middle; padding-left: 26px; font-size: 15px; line-height: 1.4; } .st-business_box a::before, .st-business_box .tokusei::before { content: ''; position: absolute; width: 8px; height: 8px; border-right: solid 1px #df0623; border-bottom: solid 1px #df0623; transform: rotateZ( -45deg); -webkit-transform: rotateZ( -45deg); margin: auto; top: 24px; left: 65px; -webkit-transition: left 0.3s ease; transition: left 0.3s ease; } .st-business_box a:hover::before { left: 71px; -webkit-transition: left 0.3s ease; transition: left 0.3s ease; } .st-business_box .tokusei { position: relative; float: left; width: 226px; margin: 0 5px 30px 0; } .st-business_box .tokusei::before { top: 6px; bottom: auto; } .st-business_box .tokusei ul { list-style: none !important; display: inline-block; margin-left: 26px; padding-left: 0 !important; width: 141px; } .st-business_box .tokusei li { display: inline-block; width: 141px; } .st-business_box .tokusei span.cap { font-size: 15px; line-height: 1.7; } .st-business_box .tokusei a { width: auto; margin: 0; } .st-business_box .tokusei a span.cap-s { font-size: 13px; letter-spacing: -0.08em; line-height: 1.7; } .st-business_box .tokusei a::before { content: none; } .st-business_box .tokusei a:hover { text-decoration: underline; } .st-business_contents .st-business_box:last-of-type { border-bottom: 0; } @media screen and (max-width: 640px) { .st-business { padding-bottom: 0; } .st-business_title { width: 100%; } .st-business_title__inner { border: none; height: auto; margin-right: 0; } .st-business_title__inner h2 { font-size: 3.90625vw; /*25*/ letter-spacing: -0.05em; padding: 5.3125vw 12.5vw 5.3125vw 15.625vw; /*34,80,34,100*/ line-height: 1.4; background-color: #fff; } .st-business_title__inner h2::before { width: 8.75vw; /*56*/ height: 8.75vw; /*56*/ top: 0; bottom: 0; left: 4.6875vw; /*30*/ } .accordion { width: 5.46875vw; /*35*/ height: 5.46875vw; /*35*/ right: 4.6875vw; /*30*/ } .accordion::before { width: 0.625vw; /*4*/ height: 3.125vw; /*20*/ } .accordion::after { width: 3.125vw; /*20*/ height: 0.625vw; /*4*/ } .st-business_contents { padding: 4.6875vw 3.125vw 3.125vw; /*30,20,20*/ } .st-business_contents h3 { font-size: 3.75vw; /*24*/ } .st-business_contents h4 { font-size: 3.4375vw; /*22*/ margin: 4.6875vw 0 3.125vw; /*30,20*/ } .st-business_box { padding-bottom: 1.5625vw; /*10*/ } .st-business_box a { width: 50%; margin: 0 0 4.6875vw 0; /*30*/ } .st-business_box img { width: 9.21875vw !important; } .st-business_box a span.cap { height: 9.375vw; /*60*/ padding-left: 4.0625vw; /*26*/ font-size: 3.125vw; /*20*/ } .st-business_box a::before, .st-business_box .tokusei::before { width: 1.5625vw; /*10*/ height: 1.5625vw; /*10*/ top: 3.75vw; /*24*/ left: 10vw; /*64*/ } .st-business_box a:hover::before { left: 10.9375vw; /*70*/ } .st-business_box .tokusei { width: 50%; margin: 0 0 4.6875vw 0; /*30*/ } .st-business_box .tokusei::before { top: 0.9375vw; /*6*/ } .st-business_box .tokusei ul { margin-left: 4.0625vw !important; /*26*/ width: 32.8125vw !important; /*210*/ } .st-business_box .tokusei li { width: 32.8125vw; /*210*/ } .st-business_box .tokusei span.cap { font-size: 3.125vw; /*20*/ line-height: 1.3; font-weight: bold; } .st-business_box .tokusei a span.cap-s { font-size: 3.125vw; /*20*/ } } /* ---------------------------------------------- ! footer Elements ---------------------------------------------- */ .st-footer-nav { width: 100%; min-width: 1290px; background-color: #fcfcfc; } @media screen and (min-width: 641px) { .st-footer-nav { border-right: solid 1px #e2e2e2; } } .st-footer-nav__inner { width: 996px; margin-left: 254px; padding-top: 30px; } .st-footer-nav__box { float: left; margin-right: 120px; } .st-footer-nav__box:last-of-type { margin-right: 0; } .st-footer-nav__inner>div>ul>li { list-style: none; font-size: 13px; margin-bottom: 2em; line-height: 1.7; } .st-footer-nav__inner li>a { position: relative; display: block; padding-left: 16px; } .st-footer-nav__inner li a::before { content: ''; position: absolute; width: 8px; height: 8px; border-right: solid 1px; border-bottom: solid 1px; transform: rotateZ( -45deg); -webkit-transform: rotateZ( -45deg); margin: auto; top: 5px; left: 0; } .st-footer-nav__inner li a:hover { text-decoration: underline; } .st-footer-nav__inner li span { display: inline-block; text-indent: 1em; } .st-footer-nav__inner>div>ul>li>ul>li { list-style: none; margin-left: 1em; } .st-footer-nav__inner>div>ul>li>ul>li>a::before { width: 6px; height: 6px; top: 6px; } .st-footer { width: 100%; height: 50px; background-color: #484848; min-width: 1290px; padding: 18.5px 0; } @media screen and (min-width: 641px) { .st-footer { border-right: solid 1px #e2e2e2; } } .st-footer__inner { width: 996px; margin-left: 254px; padding-left: 8px; } .st-footer__nav ul li { float: left; padding-left: 20px; padding-right: 20px; list-style: none; } .st-footer__nav ul li a { position: relative; color: #fff; font-size: 13px; } .st-footer__nav ul li a::before { content: ''; position: absolute; width: 8px; height: 8px; border-right: solid 1px #fff; border-bottom: solid 1px #fff; transform: rotateZ( -45deg); margin: auto; top: 5px; left: -18px; } .st-footer__nav ul li a:hover { text-decoration: underline; } .st-footer__copyright { float: right; font-size: 12px; color: #fff; } @media screen and (max-width: 640px) { .st-footer-sns { width: 100%; padding: 25px 0; text-align: center; background-color: #f0f0f0; } .st-footer-sns__inner { display: inline-block; overflow: hidden; } .st-footer-sns__inner:before { content: ''; display: inline-block; width: 45px; height: 45px; margin-right: 17px; float: left; background-image: url('../images/common/sns_title.png'); background-size: contain; } .st-footer-sns a { display: inline-block; height: 45px; margin-right: 17px; float: left; } .st-footer-sns a:nth-of-type(3) { margin-right: 0; float: right; } .st-footer-sns a:nth-of-type(4) { margin-right: 13px; } .st-footer-sns img { width: auto; height: 100%; vertical-align: top; } .st-footer-logo { margin-bottom: 7.8125vw; /*50*/ } .st-footer-logo a { display: block; width: 39.0625vw; margin: 7.8125vw auto; } .st-footer-logo p { font-size: 3.125vw; /*20*/ text-align: center; line-height: 1.8; } .st-footer { height: auto; min-width: initial; padding: 0; } .st-footer__inner { width: 100%; margin: 0; padding: 0; text-align: center; } .st-footer__nav { display: inline-block; padding-top: 7.5vw; /*48*/ } .st-footer__nav ul li { padding-left: 13.75vw; /*88*/ padding-right: 0; } .st-footer__nav ul li:first-of-type { padding-left: 4.375vw; /*28*/ } .st-footer__nav ul li a { font-size: 4.0625vw; /*26*/ } .st-footer__nav ul li a::before { width: 1.875vw; /*12*/ height: 1.875vw; /*12*/ margin: auto; top: 1.875vw; /*12*/ left: -4.375vw; /*-28*/ } .st-footer__copyright { float: none; padding: 7.5vw 0 5.9375vw; /*48,38*/ font-size: 3.125vw; /*20*/ } } /* ---------------------------------------------- .list-card ---------------------------------------------- */ .list-card { display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .list-card a:hover { text-decoration: none !important; } .list-card .btn { margin: 0 16px 20px 0; position: relative; float: left; width: 237px; min-height: 320px; text-decoration: none !important; overflow: hidden; border-radius: 5px; background-color: #fff; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.1); -webkit-box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.1); } .list-card .btn img { width: 100% !important; } .list-card .btn h2 { min-height: 34px; font-size: 13.5px; line-height: 1.4; margin-top: 14px; padding: 0 15px; } .list-card .btn .copy, .list-card .btn .description { font-size: 10.8px; line-height: 1.5; margin-top: 18px; padding: 0 15px 52px; } .list-card .btn a { text-decoration: none !important; } .list-card .btn ul.description { padding-right: 0; list-style-type: none; } .list-card .btn ul.description li { margin-bottom: .5em; } .list-card .btn ul.description a { position: relative; padding-left: 1.5em; display: inline-block; } .list-card .btn ul.description a::before { content: '\02192'; position: absolute; top: 0; left: 0; font-weight: bold; color: #333; } .list-card.copy .title, .list-card.copy .description { display: none; } .list-card.description .mcopy, .list-card.description .copy { display: none; } @media screen and (min-width: 641px) { .list-card .btn { width: calc(( 100% - 16px * 3) / 4); } .list-card .btn:nth-of-type(4n) { margin-right: 0; } } @media screen and (max-width: 640px) { .list-card .btn { width: 48%; margin-right: 2%; margin-bottom: 3.125vw; /*20*/ min-height: 64.0625vw; /*410*/ border-radius: 0.78125vw; /*5*/ -moz-border-radius: 0.78125vw; -webkit-border-radius: 0.78125vw; -o-border-radius: 0.78125vw; -ms-border-radius: 0.78125vw; } .list-card .btn:nth-of-type(2n) { margin-right: 0; } .list-card .btn::before { border-width: 16.875vw 16.875vw 0 0; /*108 108*/ top: 0.625vw; /*4*/ } .list-card .btn::after { height: 8.125vw; /*52*/ top: 1.25vw; /*8*/ left: 2.1875vw; /*14*/ } .list-card .btn h2 { min-height: 3.75vw; /*24*/ margin-top: 0; font-size: 3.4375vw; /*22*/ padding: 0 3.125vw; /*20*/ } .list-card .btn .copy, .list-card .btn .description { margin: 0; font-size: 3.125vw; /*20*/ line-height: 1.3; padding: 3.125vw 3.125vw 11.5625vw; /*20,20,74*/ } } /* ---------------------------------------------- .breadcrumb ---------------------------------------------- */ .breadcrumb { margin-bottom: 20px; } .breadcrumb ul { font-size: 0; } .breadcrumb li { display: inline-block; font-size: 12px; line-height: 1.2; } .breadcrumb li:last-child { font-weight: bold; } .breadcrumb li::after { content: '\0ff1e'; display: inline-block; margin: 0 .5em; } .breadcrumb li:last-child::after { display: none; } .breadcrumb a { transition: unset; } .breadcrumb a:hover { text-decoration: underline; } @media screen and (max-width: 640px) { .breadcrumb { width: 93.75%; margin: 0 auto; margin-bottom: 10px; white-space: nowrap; overflow-x: scroll; } } /* ---------------------------------------------- .p-category ---------------------------------------------- */ .p-title { margin-bottom: 20px; font-size: 26px; } .p-title h1 { padding: 0; font-size: 26px; font-weight: bold; line-height: 1.2; } @media screen and (max-width: 640px) { .p-title { width: 93.75%; margin: 0 auto; margin-bottom: 10px; } .p-title h1 { font-size: 16px; } } /* ---------------------------------------------- .p-copy ---------------------------------------------- */ .p-copy { height: 230px; margin-bottom: 50px; background-repeat: no-repeat; background-position: left top; background-size: contain; } body.page-id-12 .p-copy { background-image: url('../images/page/page_title01.png'); } body.page-id-20 .p-copy { background-image: url('../images/page/page_title02.png'); } body.page-id-30 .p-copy { background-image: url('../images/page/page_title03.png'); } body.page-id-32 .p-copy { background-image: url('../images/page/page_title04.png'); } body.page-id-35 .p-copy { background-image: url('../images/page/page_title05.png'); } body.page-id-37 .p-copy { background-image: url('../images/page/page_title06.png'); } body.page-id-39 .p-copy { background-image: url('../images/page/page_title07.png'); } body.page-id-42 .p-copy { background-image: url('../images/page/page_title08.png'); } body.page-id-44 .p-copy { background-image: url('../images/page/page_title09.png'); } body.page-id-46 .p-copy { background-image: url('../images/page/page_title10.png'); } body.page-id-48 .p-copy { background-image: url('../images/page/page_title11.png'); } body.page-id-112 .p-copy { background-image: url('../images/page/page_title12.png'); } body.page-id-53 .p-copy { background-image: url('../images/page/page_title13.png'); } body.page-id-55 .p-copy { background-image: url('../images/page/page_title14.png'); } body.page-id-57 .p-copy { background-image: url('../images/page/page_title15.png'); } body.page-id-59 .p-copy { background-image: url('../images/page/page_title16.png'); } body.page-id-61 .p-copy { background-image: url('../images/page/page_title17.png'); } body.page-id-63 .p-copy { background-image: url('../images/page/page_title18.png'); } body.page-id-68 .p-copy { background-image: url('../images/page/page_title19.png'); } body.page-id-70 .p-copy { background-image: url('../images/page/page_title20.png'); } body.page-id-72 .p-copy { background-image: url('../images/page/page_title21.png'); } body.page-id-74 .p-copy { background-image: url('../images/page/page_title22.png'); } body.page-id-76 .p-copy { background-image: url('../images/page/page_title23.png'); } body.page-id-78 .p-copy { background-image: url('../images/page/page_title24.png'); } body.page-id-80 .p-copy { background-image: url('../images/page/page_title25.png'); } /* body.page-26 .p-copy { background-image: url('../images/page/page_title26.png'); } body.page-27 .p-copy { background-image: url('../images/page/page_title27.png'); } body.page-28 .p-copy { background-image: url('../images/page/page_title28.png'); } body.page-29 .p-copy { background-image: url('../images/page/page_title29.png'); } body.page-30 .p-copy { background-image: url('../images/page/page_title30.png'); } */ body.page-id-6 .p-copy { background-image: url('../images/page/page_title31.png'); } body.page-id-82 .p-copy { background-image: url('../images/page/page_title32.png'); } body.page-id-85 .p-copy { background-image: url('../images/page/page_title33.png'); } body.page-id-87 .p-copy { background-image: url('../images/page/page_title34.png'); } body.page-id-89 .p-copy { background-image: url('../images/page/page_title35.png'); } body.page-id-91 .p-copy { background-image: url('../images/page/page_title36.png'); } body.page-id-93 .p-copy { background-image: url('../images/page/page_title38.png'); } body.page-id-95 .p-copy { background-image: url('../images/page/page_title37.png'); } body.page-id-97 .p-copy { background-image: url('../images/page/page_title39.png'); } body.page-id-99 .p-copy { background-image: url('../images/page/page_title40.png'); } body.page-id-101 .p-copy { background-image: url('../images/page/page_title41.png'); } body.page-id-103 .p-copy { background-image: url('../images/page/page_title42.png'); } body.page-id-105 .p-copy { background-image: url('../images/page/page_title43.png'); } body.page-id-107 .p-copy { background-image: url('../images/page/page_title44.png'); } body.page-id-109 .p-copy { background-image: url('../images/page/page_title45.png'); } body.page-id-111 .p-copy { background-image: url('../images/page/page_title46.png'); } /* body.page-id-47 .p-copy { background-image: url('../images/page/page_title47.png'); } body.page-id-48 .p-copy { background-image: url('../images/page/page_title48.png'); } body.page-id-49 .p-copy { background-image: url('../images/page/page_title49.png'); } body.page-id-50 .p-copy { background-image: url('../images/page/page_title50.png'); } */ body.page-id-51 .p-copy { background-image: url('../images/page/page_title51.png'); } body.page-99 .p-copy { background-image: none; background-color: #fff; } body.page-99 .sns { height: 74px; } body.page-99 .sns:before { display: none; } body.page-99 .p-section02 { margin-bottom: 0; padding-bottom: 50px; } .p-copy>div { position: relative; width: 996px; margin: 0 40px; } .p-copy>div::before { content: ""; position: absolute; left: 0; top: 37px; display: block; width: 0; height: 0; border-style: solid; border-width: 90px 90px 0 0; } .p-copy>div::after { content: ""; position: absolute; left: 5px; top: 42px; display: block; width: 40px; height: 40px; background-repeat: no-repeat; background-position: center center; background-size: contain; } body.page-category-01 .p-copy>div::before { border-color: #f33b69 transparent transparent transparent; } body.page-category-01 .p-copy>div::after { background-image: url(../images/common/icon01_mc.png); } body.page-category-02 .p-copy>div::before { border-color: #3069be transparent transparent transparent; } body.page-category-02 .p-copy>div::after { background-image: url(../images/common/icon02_mc.png); } /* body.page-category-03 .p-copy>div::before { border-color: #23b460 transparent transparent transparent; } body.page-category-03 .p-copy>div::after { background-image: url(../images/common/icon03_mc.png); } */ body.page-category-04 .p-copy>div::before { border-color: #ffb400 transparent transparent transparent; } body.page-category-04 .p-copy>div::after { background-image: url(../images/common/icon04_mc.png); } body.page-category-05 .p-copy>div::before { border-color: #2cadff transparent transparent transparent; } body.page-category-05 .p-copy>div::after { margin-left: .5em; background-image: url(../images/common/icon05_mc.png); } body.page-category-07 .p-copy>div::before { border-color: #ff6427 transparent transparent transparent; } body.page-category-07 .p-copy>div::after { background-image: url(../images/common/icon07_mc.png); } body.page-category-99 .p-copy>div::before { display: none; } body.page-category-99 .p-copy>div::after { background-image: none; } .p-copy>div>div { position: absolute; top: 100px; left: 70px; } .p-copy h2 { margin-bottom: .5em; font-size: 26px; text-shadow: 1px 1px 2px #fff, -1px 1px 2px #fff, 1px -1px 2px #fff, -1px -1px 2px #fff; } .p-copy h3 { font-size: 18px; font-weight: normal; text-shadow: 1px 1px 2px #fff, -1px 1px 2px #fff, 1px -1px 2px #fff, -1px -1px 2px #fff; } @media screen and (max-width: 640px) { .p-copy { height: auto; margin-bottom: 30px; background-position: right center; background-size: cover; } .p-copy>div { width: 100%; margin: 0 auto; background-color: rgba(255,255,255,.4); } .p-copy>div::before { top: 0; border-width: 45px 45px 0 0; } .p-copy>div::after { left: 2.5px; top: 2.5px; width: 20px; height: 20px; } .p-copy>div>div { position: static; padding: 20px 35px; padding-right: 10px; } .p-copy h2 { font-size: 16px; } .p-copy h3 { font-size: 14px; } } /* ---------------------------------------------- .show_page .show_home ---------------------------------------------- */ body.home .show_page, body.page .show_home { display: none !important; } /* ---------------------------------------------- .venobox ---------------------------------------------- */ .vbox-preloader { display: none; } .vbox-close { display: none !important; } .venobox-inline { display: none; } .vbox-container { overflow-y: hidden !important; } .vbox-content { height: 100vh; margin: 0 !important; padding: 0 !important; padding-top: 30px !important; cursor: pointer; } .vbox-content .figlio { width: 640px; height: calc(100vh - 160px); height: auto; max-height: calc(100vh - 110px); box-shadow: none; cursor: auto; } .vbox-content .st-contents__inner { width: 100% !important; /* min-height: 50vh; */ margin: auto !important; padding: 30px 20px; background-color: #fff; } .vbox-close { font-weight: bold; background-color: #df0623 !important; } @media screen and (max-width: 640px) { .vbox-content .figlio { width: 100%; } .vbox-content .st-contents__inner { padding: 20px 0; } } /* template-iconfont */ @font-face { font-family: "template-iconfont"; src: url("../font/template-iconfont.eot"); src: url("../font/template-iconfont.eot?#iefix") format("eot"), url("../font/template-iconfont.woff") format("woff"), url("../font/template-iconfont.ttf") format("truetype"), url("../font/template-iconfont.svg#template-iconfont") format("svg"); font-weight: normal; font-style: normal; } .st-Icon { display: inline-block; } .st-Icon:before { font-family: "template-iconfont"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; display: inline-block; vertical-align: middle; font-style: normal; font-variant: normal; font-weight: normal; line-height: 1; text-decoration: none; text-transform: none; speak: none; } .st-Icon-chevron-up:before { content: "\EA05"; } /* .st-GlobalFooter_PageTop */ .st-GlobalFooter_PageTop { position: fixed; right: 40px; bottom: 56px; display: block; width: 56px; height: 56px; padding: 0; text-align: center; border-radius: 50%; background-color: rgba(129, 129, 129, 0.7); transition-duration: 2s; transition-property: overflow, visibility, opacity; } .st-GlobalFooter_PageTop[aria-hidden="true"] { opacity: 0; visibility: hidden; overflow: hidden; height: 0; } .st-GlobalFooter_PageTop[aria-hidden="false"] { opacity: 1; visibility: visible; overflow: visible; height: 56px; } .st-GlobalFooter_PageTopIcon { height: 56px; line-height: 56px; margin-top: -0.1em; font-size: 25.6px; color: #fff; } @media screen and (max-width: 640px) { .st-GlobalFooter_PageTop { display: none !important; } } body.page-id-39 .vbox-content .figlio{ width: 100%; }