@charset "UTF-8";
@import url(/common/css/reset.css);
@import url(/common/css/style.v2.css);
@import url(/common/css/header.v2.css?20230718);
@import url(/common/css/footer.css);
@import url(/common/css/layout.v2.css);
@import url(/bs/common/css/share.css);
@import url(/common/css/smph/layout.v2.css);
.font-size58 { font-size: 3.625rem; }
@media screen and (max-width: 1024px) { .font-size58 { font-size: 2.25rem; } }
@media screen and (max-width: 767px) { .font-size58 { font-size: 2.25rem; } }

.font-size36 { font-size: 2.25rem; }
@media screen and (max-width: 1024px) { .font-size36 { font-size: 1.5rem; } }
@media screen and (max-width: 767px) { .font-size36 { font-size: 1.375rem; } }

.font-size30 { font-size: 1.875rem; }
@media screen and (max-width: 1024px) { .font-size30 { font-size: 1.5rem; } }
@media screen and (max-width: 767px) { .font-size30 { font-size: 1.375rem; } }

.font-size26 { font-size: 1.625rem; }
@media screen and (max-width: 1024px) { .font-size26 { font-size: 1.5rem; } }
@media screen and (max-width: 767px) { .font-size26 { font-size: 1.125rem; } }

.font-size22 { font-size: 1.375rem; }
@media screen and (max-width: 768px) { .font-size22 { font-size: 1.125rem; } }

.font-size18, .headline3, .headline4 { font-size: 1.125rem; }
@media screen and (max-width: 768px) { .font-size18, .headline3, .headline4 { font-size: 1.125rem; } }

.font-size15, #main { font-size: 0.9375rem; }
@media screen and (max-width: 768px) { .font-size15, #main { font-size: 0.8125rem; } }

.font-size14 { font-size: 0.88rem; }
@media screen and (max-width: 768px) { .font-size14 { font-size: 0.75rem; } }

.column, #main { width: 100%; max-width: 1024px; margin: 0 auto; padding-right: 7px; padding-left: 7px; letter-spacing: -.5em; }
.column *, #main * { letter-spacing: normal; }
@media screen and (max-width: 1024px) { .column, #main { width: 100vw; padding-right: 0; padding-left: 0; } }
.column .column, #main .column, .column #main, #main #main { padding-right: 0; padding-left: 0; letter-spacing: -.5em; }
.column .column *, #main .column *, .column #main *, #main #main * { letter-spacing: normal; }

.col12, #main > h1, #main > nav, #main > div { width: calc(100% - 20px); display: block; margin-left: auto; margin-right: auto; padding-right: 0; padding-left: 0; }
@media screen and (max-width: 1023px) { .col12, #main > h1, #main > nav, #main > div { width: 98vw; } }
@media screen and (max-width: 767px) { .col12, #main > h1, #main > nav, #main > div { width: 94vw; } }

.col9 { width: 740px; display: inline-block; margin-left: 8.75px; margin-right: 8.75px; vertical-align: top; }
@media screen and (max-width: 1024px) { .col9 { width: 74vw; margin-left: 1vw; margin-right: 1vw; } }
@media screen and (max-width: 767px) { .col9 { width: 94vw; } }

.col8 { width: 649.3333333333px; display: inline-block; margin-left: 10px; margin-right: 10px; vertical-align: top; }
@media screen and (max-width: 1024px) { .col8 { width: calc( ( ( 92vw / 3 ) * 2 ) + 2vw ); margin-left: 1vw; margin-right: 1vw; } }

.col6 { width: calc(( 100% - 40px ) / 2); display: inline-block; margin-left: 10px; margin-right: 10px; vertical-align: top; }
@media screen and (max-width: 1024px) { .col6 { width: 47vw; margin-left: 1vw; margin-right: 1vw; } }
@media screen and (max-width: 767px) { .col6 { width: 94vw; margin-left: 0; margin-right: 0; } }

.col4 { width: calc(( 100% - 62px ) / 3); display: inline-block; margin-left: calc( 60px / 6); margin-right: calc( 60px / 6); vertical-align: top; }
@media screen and (max-width: 1024px) { .col4 { width: calc( 92vw / 3 ); margin-left: 1vw; margin-right: 1vw; } }
@media screen and (max-width: 767px) { .col4 { width: 92vw; margin-left: 0; margin-right: 0; margin-bottom: 10px; } }

.col3 { width: calc(( 100% - 10px * 8 ) / 4); display: inline-block; margin-left: 10px; margin-right: 10px; vertical-align: top; }
@media screen and (max-width: 1024px) { .col3 { width: calc(( 100vw - 1vw * 8 ) / 4); margin-left: 1vw; margin-right: 1vw; } }
@media screen and (max-width: 767px) { .col3 { width: 92vw; margin-left: 0; margin-right: 0; margin-bottom: 10px; } }

@media screen and (min-width: 768px) { .sp { display: none; } }

.mt60 { margin-top: 60px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mt60 { margin-top: 30px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mt60 { margin-top: 20px; } }

.mt40 { margin-top: 40px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mt40 { margin-top: 30px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mt40 { margin-top: 20px; } }

.mt30 { margin-top: 30px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mt30 { margin-top: 15px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mt30 { margin-top: 10px; } }

.mt20, #main figure { margin-top: 20px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mt20, #main figure { margin-top: 15px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mt20, #main figure { margin-top: 10px; } }

.mb60 { margin-bottom: 60px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mb60 { margin-bottom: 30px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mb60 { margin-bottom: 20px; } }

.mb40, #main { margin-bottom: 40px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mb40, #main { margin-bottom: 30px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mb40, #main { margin-bottom: 20px; } }

.mb20, #main figure { margin-bottom: 20px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mb20, #main figure { margin-bottom: 10px !important; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mb20, #main figure { margin-bottom: 10px !important; } }

.mb10 { margin-bottom: 10px; }

.mr20 { margin-right: 20px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .mr20 { margin-right: 2vw; } }
@media screen and (max-width: 767px) and (min-width: 0) { .mr20 { margin-right: 3vw; } }

.ml20 { margin-left: 20px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .ml20 { margin-left: 2vw; } }
@media screen and (max-width: 767px) and (min-width: 0) { .ml20 { margin-left: 3vw; } }

.pt60 { padding-top: 60px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pt60 { padding-top: 30px !important; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pt60 { padding-top: 20px !important; } }

.pt40 { padding-top: 40px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pt40 { padding-top: 30px !important; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pt40 { padding-top: 20px !important; } }

.pt20 { padding-top: 20px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pt20 { padding-top: 15px !important; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pt20 { padding-top: 10px !important; } }

.pt10 { padding-top: 10px; }

.pb60 { padding-bottom: 60px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pb60 { padding-bottom: 30px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pb60 { padding-bottom: 20px; } }

.pb40 { padding-bottom: 40px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pb40 { padding-bottom: 30px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pb40 { padding-bottom: 20px; } }

.pb30 { padding-bottom: 30px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pb30 { padding-bottom: 10px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pb30 { padding-bottom: 10px; } }

.pb20 { padding-bottom: 20px; }
@media screen and (max-width: 768px) and (min-width: 768px) { .pb20 { padding-bottom: 10px; } }
@media screen and (max-width: 767px) and (min-width: 0) { .pb20 { padding-bottom: 10px; } }

.pb10 { padding-bottom: 10px; }

html { /*font-size: .81em;  /common/styleで規定済 */ }

body { /*font-size: .81em;  /common/styleで規定済 */ }

#sub { display: none; }

.headline2 { padding: 12px 15px; font-size: 19px; background-color: #0b61b7; color: #fff; font-weight: bold; }
@media screen and (max-width: 767px) { .headline2 { margin-top: 20px; } }

.headline3 { margin: 0 auto 20px; }
.headline3 span { background: #ececec; border-left: #0956b0 solid 10px; padding: 8px 50px 8px 10px; display: block; font-weight: bold; }

.headline4 { box-shadow: -4px 0 0 0 #BBCCE5, -11px 0 0 0 #4A70BB; margin-left: 11px; margin-top: 10px; margin-bottom: 20px; background-image: linear-gradient(to top, #0b61b7 100%, #0b61b7 100%); background-repeat: no-repeat; background-size: 100% 1px; background-position: left center; text-align: left; font-weight: bold; color: #0b61b7; margin-bottom: 0; }
.headline4 > * { display: inline-block; background-color: #FFF; padding: 0.2em; }

#main { float: none; }

#main > .event { display: none; }

.flex { display: flex; margin-left: -10px; margin-right: -10px; }
@media screen and (max-width: 767px) { .flex { display: block; margin-left: 0; margin-right: 0; } }
.flex .flex_50 { width: 50%; margin-left: 10px; margin-right: 10px; }
@media screen and (max-width: 767px) { .flex .flex_50 { width: 100%; margin-left: 0; margin-right: 0; } }
