@charset "Shift_JIS";
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ■ Variable */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
:root {
/*------------------------------------*/
/* color */
--pale-color: #f0fdd1;
--light-color: #9bc043;
--middle-color: #76ac06;
--main-color: #4b931f;
--dark-color: #254f23;
--pale: #f9fde8; /* 50 *//* pale */
--light: #e7eec9; /* 100 *//* light */
--bright: #e3f3a3; /* 300 *//* bright */
--neutral: #9abc18; /* 500 *//* neutral */
--dark: #5f9900; /* 600 *//* dark */
--deep:#519100; /* 700 *//* deep */
--trans: transparent; /* transparent */
--wh: #fff; /* _white */
--ulgy: #f7f7f7; /* ultra_light-gray */
--lgy: #ededed; /* light-gray */
--gy: #d9d9d9; /* -gray */
--dgy:#b2b2b2; /* dark-gray */
--udgy: #7c7c7c; /* ultra_dark-gray */
--ibk:#333; /* ink-black */
--bk: #000; /* -black */
/* ---------------------------------- */
/* contents size */
--contents-mobile-width: 375px;
--contents-mobile-padding: 1rem;
--contents-tablet-width: 750px;
--contents-tablet-padding: 1rem;
--contents-desktop-width: 1024px;
--contents-desktop-padding: 3rem;
/* ---------------------------------- */
/* font-size Viewport 375 - 750 */
--font-size-12-13: clamp(0.75rem, 0.678rem + 0.36vw, 0.844rem);/* 1.125 */
--font-size-12-14: clamp(0.75rem, 0.653rem + 0.48vw, 0.875rem);/**/
--font-size-12-18: clamp(0.75rem, 0.46rem + 1.45vw, 1.125rem);/* 1.5 */
--font-size-12-22: clamp(0.75rem, 0.243rem + 2.54vw, 1.406rem);/* 1.875 */
--font-size-12-27: clamp(0.75rem, 0.025rem + 3.62vw, 1.688rem);/* 2.25 */
--font-size-14-16: clamp(0.875rem, 0.79rem + 0.42vw, 0.984rem);/* 1.125 */
--font-size-14-21: clamp(0.875rem, 0.537rem + 1.69vw, 1.313rem);/* 1.5 */
--font-size-14-24: clamp(0.875rem, 0.392rem + 2.42vw, 1.5rem);/**/
--font-size-14-26: clamp(0.875rem, 0.283rem + 2.96vw, 1.641rem);/* 1.875 */
--font-size-14-31: clamp(0.875rem, 0.03rem + 4.23vw, 1.969rem);/* 2.25 */
--font-size-16-18: clamp(1rem, 0.903rem + 0.48vw, 1.125rem);/* 1.125 */
--font-size-16-24: clamp(1rem, 0.614rem + 1.93vw, 1.5rem);/* 1.5 */
--font-size-16-30: clamp(1rem, 0.324rem + 3.38vw, 1.875rem);/* 1.875 */
--font-size-16-36: clamp(1rem, 0.034rem + 4.83vw, 2.25rem);/* 2.25 */
--font-size-18-20: clamp(1.125rem, 1.016rem + 0.54vw, 1.266rem);/* 1.125 */
--font-size-18-27: clamp(1.125rem, 0.69rem + 2.17vw, 1.688rem);/* 1.5 */
--font-size-18-34: clamp(1.125rem, 0.364rem + 3.8vw, 2.109rem);/* 1.875 */
--font-size-18-40: clamp(1.125rem, 0.038rem + 5.43vw, 2.531rem);/* 2.25 */
--font-size-18-24: clamp(1.125rem, 0.835rem + 1.45vw, 1.5rem);
--font-size-18-36: clamp(1.125rem, 0.255rem + 4.35vw, 2.25rem);
--font-size-20-42: clamp(1.25rem, 0.187rem + 5.31vw, 2.625rem);
--font-size-20-22: clamp(1.25rem, 1.129rem + 0.6vw, 1.406rem);/* 1.125 */
--font-size-20-30: clamp(1.25rem, 0.767rem + 2.42vw, 1.875rem);/* 1.5 */
--font-size-20-38: clamp(1.25rem, 0.405rem + 4.23vw, 2.344rem);/* 1.875 */
--font-size-20-45: clamp(1.25rem, 0.042rem + 6.04vw, 2.813rem);/* 2.25 */
--font-size-24-27: clamp(1.5rem, 1.355rem + 0.72vw, 1.688rem);/* 1.125 */
--font-size-24-36: clamp(1.5rem, 0.92rem + 2.9vw, 2.25rem);/* 1.5 */
--font-size-24-45: clamp(1.5rem, 0.486rem + 5.07vw, 2.813rem);/* 1.875 */
--font-size-24-54: clamp(1.5rem, 0.051rem + 7.25vw, 3.375rem);/* 2.25 */
/* ---------------------------------- */
/* icon */
--icon__angle-down-solid: url('data:image/svg+xml,');
--icon__angle-left-solid: url('data:image/svg+xml,');
--icon__angle-right-solid: url('data:image/svg+xml,');
--icon__angle-up-solid: url('data:image/svg+xml,');
--icon__bed-solid: url('data:image/svg+xml,');
--icon__caret-down-solid: url('data:image/svg+xml,');
--icon__caret-left-solid: url('data:image/svg+xml,');
--icon__caret-right-solid: url('data:image/svg+xml,');
--icon__caret-up-solid: url('data:image/svg+xml,');
--icon__check-solid: url('data:image/svg+xml,');
--icon__circle-check-regular: url('data:image/svg+xml,');
--icon__circle-check-solid: url('data:image/svg+xml,');
--icon__circle-chevron-down-solid: url('data:image/svg+xml,');
--icon__circle-chevron-left-solid: url('data:image/svg+xml,');
--icon__circle-chevron-right-solid: url('data:image/svg+xml,');
--icon__circle-chevron-up-solid: url('data:image/svg+xml,');
--icon__circle-exclamation-solid: url('data:image/svg+xml,');
--icon__circle-info-solid: url('data:image/svg+xml,');
--icon__circle-question-solid: url('data:image/svg+xml,');
--icon__circle-solid: url('data:image/svg+xml,');
--icon__circle-xmark-solid: url('data:image/svg+xml,');
--icon__coins-solid: url('data:image/svg+xml,');
--icon__crown-solid: url('data:image/svg+xml,');
--icon__desktop-solid: url('data:image/svg+xml,');
--icon__file-lines-regular: url('data:image/svg+xml,');
--icon__file-lines-solid: url('data:image/svg+xml,');
--icon__file-pdf-solid: url('data:image/svg+xml,');
--icon__graduation-cap-solid: url('data:image/svg+xml,');
--icon__heart-solid: url('data:image/svg+xml,');
--icon__house-chimney-window-solid: url('data:image/svg+xml,');
--icon__magnifying-glass-solid: url('data:image/svg+xml,');
--icon__mobile-screen-solid: url('data:image/svg+xml,');
--icon__person-falling-burst-solid: url('data:image/svg+xml,');
--icon__seedling-solid: url('data:image/svg+xml,');
--icon__star-regular: url('data:image/svg+xml,');
--icon__star-solid: url('data:image/svg+xml,');
--icon__square-check-regular: url('data:image/svg+xml,');
--icon__square-check-solid: url('data:image/svg+xml,');
--icon__square-full-solid: url('data:image/svg+xml,');
--icon__square-regular: url('data:image/svg+xml,');
--icon__triangle-exclamation-solid: url('data:image/svg+xml,');
--icon__wheelchair-solid: url('data:image/svg+xml,');
}
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ■ Elements */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
html {
width: 100%;
height: 100%;
}
body {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
min-height: 100vh;
background-color: var(--wh);
color: var(--ibk);
font-family: 'Noto Sans JP', sans-serif;
font-size: 16px;
font-weight: 400;
}
main {display: block;}
ul, ol {font-size: 0;}
img {vertical-align: middle;}
em {font-style: normal;}
p,li,dt,dd {
text-align: justify;
word-break: break-all;
font-feature-settings: "palt";
font-size: 1rem;
}
header,
footer,
main,
div,
nav,
li {
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.section,
.section p,
.section li,
.section dt,
.section dd {
line-height: 1.625;
font-size: 16px;
}
a, button, input {
cursor: pointer;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
/*----------------------------------------------------------------------------*/
/* Blocks
------------------------------------------------------------------------------*/
/* main_contents
------------------------------------------------------------------------------*/
#main_contents {
padding-top: 70px;
}
#main_contents:after {
display: block;
content: '';
width: 100%;
height: 40px;
}
.mypage #main_contents:after {
height: 0px;
}
/* form
----------------------------------------------------------*/
.form #main_contents {
background: #f5f5f5;
}
.form #main_contents:after {
background: #fff;
background: -moz-linear-gradient(top, #f5f5f5 20%, #fff 100%);
background: -webkit-linear-gradient(top, #f5f5f5 20%,#fff 100%);
background: linear-gradient(to bottom, #f5f5f5 20%,#fff 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#ffffff',GradientType=0 );
}
.mypage #main_contents {
background: #fff;
}
/* container
------------------------------------------------------------------------------*/
.container {
position: relative;
}
/* p_section
----------------------------------------------------------*/
.p_section {
margin: 20px 12px 0 12px;
padding-bottom: 20px;
box-shadow: rgba(80, 80, 80, 0.3) 0px 0px 6px 0px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
background-color: #fff;
}
/*----------------------------------------------------------------------------*/
/* Parts
------------------------------------------------------------------------------*/
/* flexbox
------------------------------------------------------------------------------*/
.flexbox {
display: -webkit-flex;
display:-ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
/* flex_wrap
------------------------------------------------------------------------------*/
.flex_wrap {
display: -webkit-flex;
display:-ms-flexbox;
display: flex;
flex-flow: row wrap;
justify-content: space-around;
}
/* center
----------------------------------------------------------*/
.flex_center {
display: -webkit-flex;
display:-ms-flexbox;
display: flex;
justify-content: center;
align-items: center;
}
/* breadcrumbs
------------------------------------------------------------------------------*/
.breadcrumbs {
display: none;
}
/*----------------------------------------------------------------------------*/
/* decoration
------------------------------------------------------------------------------*/
/* bol_kome
----------------------------------------------------------*/
.bol_kome {
margin-left: calc(0.7em + 12px);
text-indent: -0.7em;
}
.bol_kome:before {
content: '\203b';
display: inline-block;
margin-right: 0em;
}
/* bol_kakko_notes
----------------------------------------------------------*/
.bol_kakko_notes {
position: relative;
margin-left: 2.5em;
text-indent: 0;
}
.bol_kakko_notes:before {
content: "\ff08\6ce8\ff09";
position: absolute;
top: 0em;
left: -3em;
display: inline-block;
width: 3em;
}
/* bol_icon
----------------------------------------------------------*/
.bol_icon {
margin-left: calc(0.75em + 12px);
text-indent: -0.75em;
}
.bol_icon:before {
display: inline-block;
margin-right: 0.5em;
color: #666;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
/* icon_check
--------------------------------------*/
.icon_check:before {
content: '\f00c';
}
/* icon_check_square
--------------------------------------*/
.icon_check_square:before {
content: '\f14a';
margin-left: 0.05em;
margin-right: 0.55em;
}
/* icon_check_circle
--------------------------------------*/
.icon_check_circle:before {
content: '\f058';
}
/* icon_circle
--------------------------------------*/
.icon_circle:before {
content: '\f111';
}
/* icon_yen
--------------------------------------*/
.icon_yen:before {
content: '\f157';
}
/* icon_circle
--------------------------------------*/
.icon_crown:before {
content: '\f521';
}
/* icon_caret
--------------------------------------*/
.icon_caret {
margin-left: calc(0em + 12px);
text-indent: -0.4em;
}
.icon_caret:before {
content: '\f0da';
margin-left: 0.05em;
margin-right: 0em;
}
/* icon_exclamation
--------------------------------------*/
.icon_exclamation {
content: '\f071';
}
/*----------------------------------------------------------------------------*/
/* list
------------------------------------------------------------------------------*/
/* list_icon
----------------------------------------------------------*/
.list_icon {
margin-top: 12px;
}
.list_icon li {
margin: 0.5em 0 0 calc(0.75em + 12px);
line-height: 1.4;
text-indent: -0.75em;
font-size: 0.95rem;
}
.list_icon li:nth-of-type(1) {
margin-top: 0;
}
.list_icon li:before {
display: inline-block;
margin-right: 0.5em;
color: #666;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
/* icon_check
--------------------------------------*/
ul.icon_check li:before {
content: '\f00c';
}
/* icon_check_square
--------------------------------------*/
ul.icon_check_square li:before {
content: '\f14a';
}
/* icon_check_circle
--------------------------------------*/
ul.icon_check_circle li:before {
content: '\f058';
}
/* icon_caret
--------------------------------------*/
ul.icon_caret li{
margin-left: calc(0.8em + 12px);
text-indent: -0.6em;
}
ul.icon_caret li:before {
content: '\f0da';
margin-right: 0.6em;
}
/* list_none
----------------------------------------------------------*/
.list_none {
margin-top: 12px;
}
.list_none li {
margin: 0.2em 0 0 calc(1.05em + 12px);
line-height: 1.4;
text-indent: -1.05em;
font-size: 0.9rem;
}
.list_none li:nth-of-type(1) {
margin-top: 0;
}
.list_none li:before {
content: '';
display: inline-block;
margin-right: 0.5em;
}
/* list_kome
----------------------------------------------------------*/
.list_kome {
margin-top: 12px;
}
.list_kome li {
margin: 0.2em 0 0 calc(1.05em + 12px);
line-height: 1.4;
text-indent: -1.05em;
font-size: 0.9rem;
}
.list_kome li:nth-of-type(1) {
margin-top: 0;
}
.list_kome li:before {
content: '\203b';
display: inline-block;
margin-right: 0.5em;
}
/* list_star
----------------------------------------------------------*/
.list_star {
margin-top: 12px;
}
.list_star li {
margin: 0.2em 0 0 calc(0.75em + 12px);
line-height: 1.4;
text-indent: -0.75em;
font-size: 0.9rem;
}
.list_star li:nth-of-type(1) {
margin-top: 0;
}
.list_star li:before {
content: '\02605';
display: inline-block;
margin-right: 0.5em;
}
.star_red li:before {
color: #cf4216;
}
/* list_kome_n
----------------------------------------------------------*/
.list_kome_n {
margin-top: 12px;
counter-reset: kome_n;
}
.list_kome_n li {
margin: 0.2em 0 0 calc(1.05em + 12px);
line-height: 1.4;
text-indent: -1.05em;
font-size: 0.9rem;
counter-increment: kome_n;
}
.list_kome_n li:nth-of-type(1) {
margin-top: 0;
}
.list_kome_n li:before {
content: "\203b"counter(kome_n);
display: inline-block;
margin-right: 0.5em;
}
/* list_paren_n
----------------------------------------------------------*/
.list_paren_n {
margin-top: 12px;
counter-reset: paren_n;
}
.list_paren_n li {
margin: 0.2em 0 0 calc(1.25em + 12px);
line-height: 1.4;
text-indent: -1.0em;
font-size: 0.9rem;
counter-increment: paren_n;
}
.list_paren_n li:nth-of-type(1) {
margin-top: 0;
}
.list_paren_n li:before {
content: "("counter(paren_n)")";
display: inline-block;
margin-right: 0.5em;
}
/* list_kakko_n
----------------------------------------------------------*/
.list_kakko_n {
margin-top: 12px;
counter-reset: kakko_n;
}
.list_kakko_n li {
margin: 0.2em 0 0 calc(1.25em + 12px);
line-height: 1.4;
text-indent: -1.0em;
font-size: 0.9rem;
counter-increment: kakko_n;
}
.list_kakko_n li:nth-of-type(1) {
margin-top: 0;
}
.list_kakko_n li:before {
content: "["counter(kakko_n)"]";
display: inline-block;
margin-right: 0.5em;
}
/* list_bracket_n
----------------------------------------------------------*/
.list_bracket_n {
margin-top: 12px;
counter-reset: bracket_n;
}
.list_bracket_n li {
margin: 0.2em 0 0 calc(1.25em + 12px);
line-height: 1.4;
text-indent: -1.0em;
font-size: 0.9rem;
counter-increment: bracket_n;
}
.list_bracket_n li:nth-of-type(1) {
margin-top: 0;
}
.list_bracket_n li:before {
content: "["counter(bracket_n)"]";
display: inline-block;
margin-right: 0.5em;
}
/* list_bracket_a
----------------------------------------------------------*/
.list_bracket_a {
margin-top: 12px;
counter-reset: bracket_a;
}
.list_bracket_a li {
margin: 0.2em 0 0 calc(1.25em + 12px);
line-height: 1.4;
text-indent: -1.0em;
font-size: 0.9rem;
counter-increment: bracket_a;
}
.list_bracket_a li:nth-of-type(1) {
margin-top: 0;
}
.list_bracket_a li:before {
content: "["counter(bracket_a, upper-alpha)"]";
display: inline-block;
margin-right: 0.5em;
}
/* list_maru_n
----------------------------------------------------------*/
.list_maru_n {
margin-top: 12px;
counter-reset: maru_n;
}
.list_maru_n li {
margin: 0.2em 0 0 calc(0.75em + 12px);
line-height: 1.4;
text-indent: -0.75em;
font-size: 0.9rem;
counter-increment: maru_n;
}
.list_maru_n li:nth-of-type(1) {
margin-top: 0;
}
.list_maru_n li:before {
display: inline-block;
margin-right: 0.5em;
}
.list_maru_n li:nth-of-type(1):before {content: '\02460';}
.list_maru_n li:nth-of-type(2):before {content: '\02461';}
.list_maru_n li:nth-of-type(3):before {content: '\02462';}
.list_maru_n li:nth-of-type(4):before {content: '\02463';}
.list_maru_n li:nth-of-type(5):before {content: '\02464';}
.list_maru_n li:nth-of-type(6):before {content: '\02465';}
.list_maru_n li:nth-of-type(7):before {content: '\02466';}
.list_maru_n li:nth-of-type(8):before {content: '\02467';}
.list_maru_n li:nth-of-type(9):before {content: '\02468';}
.list_maru_n li:nth-of-type(10):before {content: '\02469';}
.list_maru_n li:nth-of-type(11):before {content: '\0246a';}
.list_maru_n li:nth-of-type(12):before {content: '\0246b';}
.list_maru_n li:nth-of-type(13):before {content: '\0246c';}
.list_maru_n li:nth-of-type(14):before {content: '\0246d';}
.list_maru_n li:nth-of-type(15):before {content: '\0246e';}
.list_maru_n li:nth-of-type(16):before {content: '\0246f';}
.list_maru_n li:nth-of-type(17):before {content: '\02470';}
.list_maru_n li:nth-of-type(18):before {content: '\02471';}
.list_maru_n li:nth-of-type(19):before {content: '\02472';}
.list_maru_n li:nth-of-type(20):before {content: '\02473';}
/* list_n_dot
----------------------------------------------------------*/
.list_n_dot {
margin-top: 12px;
counter-reset: n_dot;
}
.list_n_dot li {
margin: 0.2em 0 0 calc(1.25em + 12px);
line-height: 1.4;
text-indent: -1.0em;
font-size: 0.9rem;
counter-increment: n_dot;
}
.list_n_dot li:nth-of-type(1) {
margin-top: 0;
}
.list_n_dot li:before {
content: counter(n_dot)".";
display: inline-block;
margin-right: 0.5em;
}
/*----------------------------------------------------------------------------*/
/* Buttons
------------------------------------------------------------------------------*/
/* Buttons */
/*----------------------------------------*/
.btn {
position: relative;
display: block;
box-sizing: border-box;
margin: 0 auto;
padding: 1.6ch 12px 1.7ch 12px;
width: 100%;
line-height: 1.2;
box-shadow: rgba(80, 80, 80, 0.4) 0px 1px 4px 0px;
border-radius: 100px;
background: -moz-linear-gradient(left, #f0f0f0 0%, #f0f0f0 100%);
background: -webkit-linear-gradient(left, #f0f0f0 0%, #f0f0f0 100%);
background: linear-gradient(to right, #f0f0f0 0%, #f0f0f0 100%);
color: #333;
font-family: "NSJP";
font-size: 1rem;
font-weight: 900;
letter-spacing: 0.1em;
text-align: center;
text-decoration: none;
cursor: pointer;
transition: .3s;
}
.btn_s {
padding: 6px 20px 8px 20px;
width: auto;
}
.btn_l {
font-size: 1.4rem;
}
.btn:hover {
-webkit-transform: translateY(1px);
transform: translateY(1px);
box-shadow: rgba(80, 80, 80, 0.6) 0px 0px 2px 0px;
background: -moz-linear-gradient(left, #f0f0f099 0%, #e1e1e199 100%);
background: -webkit-linear-gradient(left, #f0f0f099 0%, #e1e1e199 100%);
background: linear-gradient(to right, #f0f0f099 0%, #e1e1e199 100%);
transition: .3s;
}
input:checked + .btn {
-webkit-transform: translateY(1px);
transform: translateY(1px);
box-shadow: rgba(80, 80, 80, 0.4) 0px 1px 4px 0px;
background: #ff6496;
background: -moz-linear-gradient(left, #ff6496 0%, #fa8282 100%);
background: -webkit-linear-gradient(left, #ff6496 0%, #fa8282 100%);
background: linear-gradient(to right, #ff6496 0%, #fa8282 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6496', endColorstr='#fa8282',GradientType=1 );
color: #fff;
font-weight: 900;
}
.btn_rd {
background: #e50000;
background: -moz-linear-gradient(left, #e50000 0%, #fd4b4b 100%);
background: -webkit-linear-gradient(left, #e50000 0%, #fd4b4b 100%);
background: linear-gradient(to right, #e50000 0%, #fd4b4b 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e50000', endColorstr='#fd4b4b',GradientType=1 );
color: #fff;
}
.btn_rd:hover {
background: #f74d4d;
background: -moz-linear-gradient(left, #f74d4d 0%, #ff7474 100%);
background: -webkit-linear-gradient(left, #f74d4d 0%, #ff7474 100%);
background: linear-gradient(to right, #f74d4d 0%, #ff7474 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f74d4d', endColorstr='#ff7474',GradientType=1 );
}
.btn_pk {
background: rgb(255,100,150);
background: -moz-linear-gradient(left, #ff6496 0%, #fa8282 100%);
background: -webkit-linear-gradient(left, #ff6496 0%, #fa8282 100%);
background: linear-gradient(to right, #ff6496 0%, #fa8282 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6496', endColorstr='#fa8282',GradientType=1 );
color: #fff;
}
.btn_pk:hover {
background: rgb(255,100,150);
background: -moz-linear-gradient(left, #ff73a0 0%, #ff7a7a 100%);
background: -webkit-linear-gradient(left, #ff73a0 0%, #ff7a7a 100%);
background: linear-gradient(to right, #ff73a0 0%, #ff7a7a 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6496', endColorstr='#fa8282',GradientType=1 );
}
.btn_or {
background: -moz-linear-gradient(left, #ff512e 0%, #f17800 100%);
background: -webkit-linear-gradient(left, #ff512e 0%, #f17800 100%);
background: linear-gradient(to right, #ff512e 0%, #f17800 100%);
color: #fff;
}
.btn_or:hover {
background: -moz-linear-gradient(left, #ff512e 0%, #f17800 100%);
background: -webkit-linear-gradient(left, #ff512e 0%, #f17800 100%);
background: linear-gradient(to right, #ff512ebf 0%, #f17800c7 100%);
}
.btn_bl {
background: #1e65d8;
background: -moz-linear-gradient(left, #1e65d8 0%, #5ac0dd 100%);
background: -webkit-linear-gradient(left, #1e65d8 0%,#5ac0dd 100%);
background: linear-gradient(to right, #1e65d8 0%, #5ac0dd 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e65d8', endColorstr='#3bd7e5',GradientType=1 );
color: #fff;
}
.btn_bl:hover {
background: #2d73e4;
background: -moz-linear-gradient(left, #2d73e4 0%, #68c9e4 100%);
background: -webkit-linear-gradient(left, #2d73e4 0%,#68c9e4 100%);
background: linear-gradient(to right, #2d73e4 0%,#68c9e4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2d73e4', endColorstr='#4ee7f5',GradientType=1 );
}
.btn_submit {
padding: 24px 12px 26px 12px;
background: -moz-linear-gradient(left, #ff7e64 0%, #ff9b37 100%);
background: -webkit-linear-gradient(left, #ff7e64 0%, #ff9b37 100%);
background: linear-gradient(to right, #ff7e64 0%, #ff9b37 100%);
color: #fff;
font-size: 18px;
font-weight: 900;
}
.btn_submit:hover {
background: -moz-linear-gradient(left, #ff7e6499 0%, #ff9b37cc 100%);
background: -webkit-linear-gradient(left, #ff7e6499 0%, #ff9b37cc 100%);
background: linear-gradient(to right, #ff7e6499 0%, #ff9b37cc 100%);
}
.btn_or:disabled,
.btn_submit:disabled {
opacity: .2;
}
.btn_or:disabled:hover,
.btn_submit:disabled:hover {
background: -moz-linear-gradient(left, #ff7e64 0%, #ff9b37 100%);
background: -webkit-linear-gradient(left, #ff7e64 0%, #ff9b37 100%);
background: linear-gradient(to right, #ff7e64 0%, #ff9b37 100%);
}
.btn span {
display: inline-block;
}
.block_btn,
.wrap_btn {
margin: 24px 12px 0 12px;
text-align: center;
}
/* .btn_wrap */
.btn_wrap {
position: relative;
display: block;
margin: 0 auto;
}
.btn_wrap_s {
position: relative;
display: inline-block;
margin: 0 auto;
}
.txt_wh {
color: #fff;
}
.btn_next:after {
content: '\f0da';
position: absolute;
top: 50%;
right: 0;
margin: -0.64em 20px 0 0;
font-size: 1.6rem;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.btn_next .btn {
padding: 1.6ch calc(12px + 1.2em) 1.7ch 12px;
}
.btn_next_s:after {
content: '\f0da';
position: absolute;
top: 50%;
right: 0;
margin: -0.7em 12px 0 0;
font-size: 1.4rem;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.btn_next_s .btn_s {
padding: 6px calc(12px + 1.4em) 8px 20px;
}
.btn_icon {
padding: 1.6ch 12px 1.7ch 32px;
}
.btn_icon:before {
position: absolute;
top: 50%;
left: 0;
margin: -0.6em 0 0 20px;
font-size: 1.8rem;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.icon_phone:before {
content: '\f3cd';
}
/* Home Button */
/*----------------------------------------*/
.btn_home {
display: inline-block;
padding-left: 2.5em;
width: auto;
}
.btn_home:before {
content: "\f015";
display: inline-block;
position: absolute;
top: 50%;
left: 12px;
margin-top: -0.6em;
font-family:"Font Awesome 5 Free";
font-size: 20px;
font-weight: 900;
}
/* PageTop Button */
/*----------------------------------------*/
.btn_page_top {
position: fixed;
right: 10px;
bottom: 37px;
z-index: 10;
width: 100px;
text-align: center;
}
/*
.btn_page_top {
display: block;
margin: 0 auto;
width: auto;
text-align: center;
}
*/
.btn_page_top a {
display: inline-block;
margin: 0 auto;
padding: 6px 24px;
line-height: 1;
box-shadow: rgba(80, 80, 80, 0.4) 0px 1px 4px 0px;
border-radius: 50px;
background: -moz-linear-gradient(left, #2864be 0%, #6ea0f0 100%);
background: -webkit-linear-gradient(left, #2864be 0%, #6ea0f0 100%);
background: linear-gradient(to right, #2864be 0%, #6ea0f0 100%);
color: #fff;
font-size: 12px;
letter-spacing: 0.06em;
}
.btn_page_top a:hover {
-webkit-transform: translateY(1px);
transform: translateY(1px);
box-shadow: rgba(80, 80, 80, 0.6) 0px 0px 2px 0px;
background: -moz-linear-gradient(left, #3b7ad8 0%, #8ab7ff 100%);
background: -webkit-linear-gradient(left, #3b7ad8 0%, #8ab7ff 100%);
background: linear-gradient(to right, #3b7ad8 0%, #8ab7ff 100%);
}
/* btn_pdf
----------------------------------------------------------*/
.btn_pdf:after {
content: '\f1c1';
margin-left: 0.3em;
color: #fff;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
/* Caution */
/*----------------------------------------*/
.block_caution {
margin: 20px 12px 0 12px;
padding: 8px 12px 7px 12px;
/* box-shadow: rgba(88, 88, 88, 0.3) 0px 1px 3px 0px; */
border: 2px solid #bb0303;
border-radius: 4px;
background-color: #ffffffb3;
}
section .block_caution {
border-radius: 4px;
}
.txt_caution {
color: #bb0303;
font-size: 15px;
font-weight: bold;
line-height: 1.4;
}
.txt_caution:before {
content: "\f071";
margin-right: 3px;
font-family:"Font Awesome 5 Free";
font-size: 12px;
font-weight: 900;
font-style: normal;
font-variant: normal;
vertical-align: middle;
text-transform: middle;
-webkit-font-smoothing: antialiased;
speak: none;
}
.block_caution .txt_caution {
text-align: center;
}
.txt_caution span {
display: inline-block;
}
/* Text Link */
/*----------------------------------------*/
.link_txt {
position: relative;
display: inline-block;
padding-bottom: 2px;
line-height: 1.2;
border-bottom: 1px dashed #ff237d;
}
.link_txt:before {
content: '\f0a9';
position: absolute;
top: 50%;
left: -1.2rem;
margin-top: -0.6rem;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.link_txt:hover {
border-bottom: 1px dotted transparent;
color: #ff237d;
}
/* link_pdf
----------------------------------------------------------*/
.link_pdf {
/* position: relative; */
/* display: inline-block; */
margin-right: 0.5rem;
line-height: 1.2;
border-bottom: 1px dashed #4d96e3;
color: #4d96e3;
}
.link_pdf:hover {
border-bottom: 1px dotted transparent;
color: var(--main-color);
}
.link_pdf:after {
content: '\f1c1';
margin-left: 0.3em;
color: #4d96e3;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.link_pdf:hover:after {
color: var(--main-color);
}
/* anchor Link */
/*----------------------------------------*/
.anchor {
margin-top: -100px;
padding-top: 100px;
}
/* Position */
/*----------------------------------------*/
.center {
text-align: center;
}
.right {
text-align: right;
}
.margin_t_6 {
margin-top: 6px;
}
.margin_t_12 {
margin-top: 12px;
}
.margin_b_12 {
margin-bottom: 12px;
}
.margin_t_24 {
margin-top: 24px;
}
.margin_b_24 {
margin-bottom: 24px;
}
/* Text Decoration */
/*----------------------------------------*/
.underline {
line-height: 1.7;
border-bottom: 1px dashed #555;
}
.line_pink {
border-color: #ff6496;
}
.align_center {
text-align: center;
}
.align_right {
text-align: right;
}
.margin_top_20 {
margin-top: 20px;
}
.margin_top_24 {
margin-top: 24px;
}
.margin_top_30 {
margin-top: 30px;
}
.txt_re {
color: #cf4216;
}
.txt_gr {
color: #008000;
}
.txt_or {
color: #ff502d;
}
/* for Mobile,PC */
/*----------------------------------------*/
.for_p,
.for_desktop {
display: none;
}
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ■ Mobile */
/* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// */
/* ---------------------------------------------------------------------------------------------- */
/* header //////////////////////////////////////////////////////////////////////////////////////////
------------------------------------------------------------------------------------------------- */
#site-header {
position: fixed;
z-index: 9999;
top: 0;
left: 0;
width: 100%;
height: 70px;
background-color: var(--deep);
color: var(--wh);
}
#site-header > .site-header-wrapper {
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: space-between;
padding: 0 0 0 var(--contents-mobile-padding);
width: 100%;
height: 70px;
}
#site-title, #site-tel {
display: flex;
flex-flow: row wrap;
justify-content: center;
align-items: center;
max-width: calc(100% / 2);
line-height: 1;
color: var(--wh);
font-size: var(--font-size-12-13);
}
#site-tel {
justify-content: flex-end;
padding: 0 var(--contents-mobile-padding);
height: 100%;
background-color: #87b41b;
text-align: center;
}
#site-catch, #site-logo {
flex-basis: 100%;
}
@media screen and (min-width: 510px) {
#site-catch {
margin-top: -.3em;
}
}
#site-catch a {
display: inline-block;
padding-bottom: .25em;
line-height: 1.2;
color: #fff;
font-family: 'Zen Maru Gothic';
font-size: clamp(0.625rem, 0.48rem + 0.72vw, 0.813rem);
font-weight: 800;
}
#site-catch span {
display: inline-block;
}
#site-logo a {
display: inline-block;
line-height: 1;
color: #fff;
font-size: clamp(1.1rem, 0.792rem + 1.54vw, 1.5rem);
font-weight: 800;
}
#site-tel a {
position: relative;
display: block;
padding-left: 1.25em;
line-height: 1;
color: #fff;
font-size: clamp(1rem, 0.383rem + 3.08vw, 1.8rem);
font-weight: 600;
}
#site-tel a:before {
content: '';
display: inline-block;
position: absolute;
top: 0.15em;
margin-left: -1em;
mask-image: var(--icon__mobile-screen-solid);
mask-repeat: no-repeat;
justify-self: center;
inline-size: .85em;
aspect-ratio: 1;
background: linear-gradient(currentColor 0 0), CanvasText;
}
.site-tel-wrapper > span {
display: block;
margin-top: .35em;
}
#site-tel span span {
display: inline-block;
line-height: 1.2;
font-size: clamp(0.688rem, 0.591rem + 0.48vw, 0.813rem);
}
@media screen and (min-width: 510px) {
.site-tel-wrapper > span {
margin-right: -.75em;
}
}
/*----------------------------------------------------------------------------*/
/* Mypage Header
------------------------------------------------------------------------------*/
#mypage_header {
position: -webkit-sticky;
/* position: sticky; */
top: 0;
z-index: 10000;
background: #fff;
border-bottom: 3px #6f6f6f solid;
}
#mypage_header .container {
padding: 12px 12px 12px 12px;
}
#mypage_header .flex_wrap {
justify-content: start;
width: 100%;
}
#mypage_header .header_logo {
width: 100%;
}
#mypage_header h1 {
padding-top: 0;
width: 33%;
text-align: left;
color: #fff;
font-size: 0.75rem;
line-height: 1;
}
#mypage_header h1 img {
width: 100%;
}
#mypage_header .btn_mypage_top {
position: absolute;
top: 15%;
right: 114px;
}
#mypage_header .btn_logout {
position: absolute;
top: 15%;
right: 12px;
}
#mypage_header .btn_mypage_top .btn,
#mypage_header .btn_logout .btn {
padding: 6px 12px 8px 12px;
font-size: .8rem;
letter-spacing: 0em;
}
#loginType #mypage_header .btn {
display: none;
}
/*
#header .header_logo {
position: relative;
width: 50%;
}
#header .header_logo figure {
position: relative;
display: block;
width: 205px;
height: auto;
background: url(/images/img_logo_sghk.png) no-repeat;
background-size: 80%;
}
*/
/*--------------------------------------------------------*/
/* SS
----------------------------------------------------------*/
.smileschool #mypage_header {
background-color: #f3c51d;
border-bottom: solid #f3c51d;
}
.smileschool #mypage_header .container {
padding: 0 24px 16px 24px;
}
/*--------------------------------------------------------*/
/* HC
----------------------------------------------------------*/
.hotcycle #mypage_header {
background: #4088c7;
background: -moz-linear-gradient(top, #4088c7 0%, #2e4e8b 100%);
background: -webkit-linear-gradient(top, #4088c7 0%,#2e4e8b 100%);
background: linear-gradient(to bottom, #4088c7 0%,#2e4e8b 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4088c7', endColorstr='#2e4e8b',GradientType=0 );
border-bottom: solid #2e4e8b;
}
.hotcycle #mypage_header .container {
padding: 6px 12px 4px 12px;
}
.hotcycle #mypage_header h1 {
width: 28%;
}
/*--------------------------------------------------------*/
/* SC
----------------------------------------------------------*/
.smilecycle #mypage_header {
background: #4088c7;
background: -moz-linear-gradient(top, #4088c7 0%, #2e4e8b 100%);
background: -webkit-linear-gradient(top, #4088c7 0%,#2e4e8b 100%);
background: linear-gradient(to bottom, #4088c7 0%,#2e4e8b 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4088c7', endColorstr='#2e4e8b',GradientType=0 );
border-bottom: solid #2e4e8b;
}
.smilecycle #mypage_header .container {
padding: 6px 12px 6px 12px;
}
.smilecycle #mypage_header h1 {
width: 20%;
}
/* ---------------------------------------------------------------------------------------------- */
/* footer //////////////////////////////////////////////////////////////////////////////////////////
------------------------------------------------------------------------------------------------- */
#site-footer {
padding-bottom: 1rem;
width: 100%;
/* border-top: 1px solid #e6f5a5; */
background: url(/assets/img/common/bg_footer.svg) no-repeat;
background-size: cover;
background-position: center bottom;
}
#site-footer > .site-footer-wrapper {
padding: 0 var(--contents-mobile-padding);
}
#site-footer nav {
margin-top: 2.5rem;
}
#site-footer ul {
display: flex;
flex-flow: row wrap;
justify-content: space-between;
width: 100%;
}
#site-footer ul li {
display: flex;
align-items: center;
flex-basis: calc((100% - 1rem) / 2);
border-radius: 100ch;
background: #fdfff7;
}
#site-footer ul li:not(:nth-of-type(1),:nth-of-type(2)) {
margin-top: 1rem;
}
#site-footer ul li:hover {
background-color: #e2f88d;
}
#site-footer ul a {
padding: .75em 1em;
flex-basis: 100%;
text-align: center;
line-height: 1.25;
color: var(--deep);
font-size: var(--font-size-12-13);
font-weight: 800;
letter-spacing: .1em;
}
#site-footer ul li:hover a {
color: #3b6900;
}
#site-footer ul span {
display: inline-block;
}
#site-footer dl {
margin-top: 2rem;
font-size: var(--font-size-16-18);
}
#site-footer dt {
font-size: var(--font-size-12-13);
font-weight: 800;
}
#site-footer dd {
margin-top: .25em;
line-height: 1.5;
font-size: var(--font-size-12-13);
font-weight: 400;
}
#site-footer dl + div {
margin-top: calc(1rem - .9rem);
display: flex;
flex-flow: row wrap;
align-items: center;
justify-content: space-between;
}
.siteseal img {
padding-top: .58rem;
width: 100px !important;
}
.approval_num {
margin-top: -.5rem;
text-align: right;
font-size: var(--font-size-12-13);
}
.approval_num .for_m,
.approval_num .for_mobile {
display: block;
}
.copyright {
display: block;
margin-top: 1rem;
width: 100%;
text-align: center;
font-size: var(--font-size-12-13);
font-weight: 500;
}
/*----------------------------------------------------------------------------*/
/* simple_footer
------------------------------------------------------------------------------*/
.simple_footer #footer {
display: block;
margin-top: 0px;
padding-top: 0px;
background: none;
}
/* wrapper
----------------------------------------------------------*/
.simple_footer #footer .wrapper {
padding-top: 0px;
background-color: #e1e1e1;
}
/* flex_wrap
----------------------------------------------------------*/
.simple_footer #footer .flex_wrap {
flex-flow: row wrap;
justify-content: left;
}
.simple_footer #footer .flex_item {
width: 100%;
}
/* nav_footer
----------------------------------------------------------*/
.simple_footer #footer .nav_footer ul {
margin: 20px 12px 0 12px;
}
.simple_footer #footer .nav_footer li {
position: relative;
display: inline-block;
padding-left: 0.8rem;
padding-bottom: 0px;
line-height: 1.2;
margin: 6px 0 0 12px;
width: calc((100% - 12px) / 2);
border-bottom: 1px dashed #afafaf;
font-size: 12px;
}
.simple_footer #footer .nav_footer li:nth-of-type(2n+1) {
margin-left: 0;
}
.simple_footer #footer .nav_footer li:before {
content: '\f0da';
position: absolute;
top: 50%;
left: 0rem;
margin-top: -0.4rem;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
.simple_footer #footer .nav_footer li:hover {
color: #7a7a7a;
}
.simple_footer #footer .nav_footer li a {
display: block;
padding: 8px 8px 8px 0px;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
background-color: transparent;
line-height: 1.2;
letter-spacing: 0.02em;
text-align: left;
color: #222;
font-size: 0.9rem;
font-weight: 900;
}
.simple_footer #footer .nav_footer li a:hover {
background-color: transparent;
color: #7a7a7a;
}
/* company
----------------------------------------------------------*/
.simple_footer #footer .company {
margin: 24px 1rem 0 1rem;
font-size: .9rem;
}
.simple_footer #footer .company dt {
font-size: .85rem;
}
.simple_footer #footer .company dd:nth-of-type(1) {
margin-top: .25em;
font-size: 1.0rem;
font-weight: 700;
}
.simple_footer #footer .company dd:nth-of-type(2) {
margin-top: .5em;
font-size: .8rem;
}
/* mypage */
.mypage #footer .item_tel {
display: none;
}
.simple_footer .approval_num {
margin: 1em 1rem;
font-size: .85rem;
line-height: 1.6;
}
/* copyright
----------------------------------------------------------*/
.simple_footer #footer .copyright {
margin-top: 48px;
padding: 6px 0;
background-color: #6f6f6f;
color: #fff;
}
/*--------------------------------------------------------*/
/* SS
----------------------------------------------------------*/
.smileschool #footer .wrapper {
border-top: solid #f3c51d;
background: transparent url(/smileschool/assets/img/bg_dot_y.png) repeat;
color: #333;
}
/* nav_footer
----------------------------------------------------------*/
.smileschool #footer .nav_footer li {
border-bottom: 1px dashed #b1b1d2;
}
.smileschool #footer .nav_footer li:before {
color: #0000ee;
}
.smileschool #footer .nav_footer li:hover {
color: #4d45be;
}
.smileschool #footer .nav_footer li a {
color: #0000ee;
font-size: 0.9rem;
font-weight: 900;
}
.smileschool #footer .nav_footer li a:hover {
background-color: transparent;
color: #4d45be;
}
/* copyright
----------------------------------------------------------*/
/* SS
----------------------------------------------------------*/
.smileschool #footer .copyright {
margin-top: 48px;
background-color: transparent;
color: #222;
}
/*--------------------------------------------------------*/
/* HC
----------------------------------------------------------*/
.hotcycle #footer .copyright {
background-color: #2e4e8b;
}
/*--------------------------------------------------------*/
/* SC
----------------------------------------------------------*/
.smilecycle #footer .copyright {
background-color: #2e4e8b;
}
/* main */
/*-------------------------------------------------------------------------------------------*/
main {
/* padding-bottom: 40px; */
}
/* main header */
/*-------------------------------------------------------------------------------------------*/
/*
main header {
padding: 18px;
background-color: #fff;
background: url(/assets/img/common/bg_watercolor_bl.jpg) no-repeat;
background-size: cover;
}
main header h1 {
color: #222;
font-family: "NSJP";
font-size: 28px;
font-weight: 900;
text-align: center;
}
*/
main header p {
margin-top: 18px;
line-height: 1.2;
color: #222;
font-size: 14px;
}
main header p strong {
display: block;
color: #e64614;
}
/* aside
--------------------------------------------------------------------------------*/
/* bnr
--------------------------------------------------------------------------------*/
.bnr {
margin: 0 12px;
padding: 40px 0 40px 0;
}
.bnr figure {
margin-top: 12px;
}
.bnr figure:nth-of-type(1) {
margin-top: 0;
}
.bnr img {
width: 100%;
}
/* address
--------------------------------------------------------------------------------*/
/* bottom_contact
--------------------------------------------------------------------------------*/
#bottom_contact {
/* margin-top: 40px; */
padding: 40px 0px;
background-color: #f5f5f5;
}
#bottom_contact .flex_wrap {
flex-flow: column nowrap;
align-items: center;
}
#bottom_contact .flex_item {
text-align: center;
}
#bottom_contact #item_head_contact {
font-family: "NSJP";
font-size: 1.1rem;
font-weight: 900;
line-height: 1.2;
letter-spacing: 0.02em;
}
#bottom_contact .num {
margin-top: 6px;
color: #252525;
font-family: "NSJP";
font-size: 2rem;
font-weight: 900;
line-height: 1;
letter-spacing: 0.02em;
}
#bottom_contact .num small {
display: inline-block;
margin-top: -5px;
padding: 3px 8px 4px 9px;
border: 1px solid #222;
font-size: 0.85rem;
vertical-align: middle;
}
#bottom_contact .num span {
display: inline-block;
}
#bottom_contact .notes {
margin-top: 6px;
font-size: 0.85rem;
line-height: 1.2;
letter-spacing: 0.02em;
}
#bottom_contact .notes span {
display: inline-block;
}
/* aside
--------------------------------------------------------------------------------*/
/* side_bar
--------------------------------------------------------------------------------*/
#side_bar {
padding: 40px 0px;
min-height: 200px;
}
#side_bar .flex_wrap {
justify-content: space-between;
margin-top: 12px;
padding: 0 12px;
}
#side_bar .flex_item {
position: relative;
display: block;
width: 100%;
height: auto;
border-radius: 0.5ch;
box-shadow: 0 1rem 0.5rem -1.2rem rgba(25, 59, 77, 0.2);
border: 1px solid #ccc;
min-height: 120px;
}
#side_bar .flex_item:nth-of-type(n + 3) {
margin-top: 12px;
}
#side_bar .flex_item#side_bnr {
border: none;
}
#side_bar h2 {
position: relative;
margin: 10px 0 0 0;
padding: 0px 12px 12px 12px;
color: #222;
font-family: "NSJP";
font-size: 0.9rem;
font-weight: 900;
line-height: 1.0;
letter-spacing: 0.02em;
}
#side_bar h2:after {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 3px;
content: '';
background-image: -webkit-repeating-linear-gradient(135deg, #a0a0a0, #a0a0a0 1px, transparent 2px, transparent 5px);
background-image: repeating-linear-gradient(-45deg, #a0a0a0, #a0a0a0 1px, transparent 2px, transparent 5px);
background-size: 5px 7px;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
#side_bar .item_contents {
padding: 0 12px 12px 12px;
font-size: 0.8rem;
line-height: 1.4;
}
#side_bar .item_contents p {
margin-top: 6px;
}
#side_bar .item_contents p:nth-of-type(1) {
margin-top: 12px;
}
#side_bar .item_contents .btn {
margin-top: 12px;
}
#side_bar .flex_item img {
width: 100%;
border-radius: 0.5ch;
}
/* side_bar
--------------------------------------------------------------------------------*/
/* side_login / side_contact
--------------------------------------------------------------------------------*/
#side_bar #side_login,
#side_bar #side_accident,
#side_bar #side_contact {
width: calc((100% - 12px) / 2);
}
#side_bar #side_login .item_contents p,
#side_bar #side_accident .item_contents p,
#side_bar #side_contact .item_contents p {
min-height: 2rem;
}
#side_bar #side_contact {
display: none;
}
/* side_bar
--------------------------------------------------------------------------------*/
/* side_login
--------------------------------------------------------------------------------*/
#side_bar #side_login .btn {
background: rgb(255,100,150);
background: -moz-linear-gradient(left, #ff6496 0%, #fa8282 100%);
background: -webkit-linear-gradient(left, #ff6496 0%, #fa8282 100%);
background: linear-gradient(to right, #ff6496 0%, #fa8282 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6496', endColorstr='#fa8282',GradientType=1 );
color: #fff;
font-weight: 900;
}
#side_bar #side_login .btn:hover {
background: rgb(255,100,150);
background: -moz-linear-gradient(left, #ff73a0 0%, #ff7a7a 100%);
background: -webkit-linear-gradient(left, #ff73a0 0%, #ff7a7a 100%);
background: linear-gradient(to right, #ff73a0 0%, #ff7a7a 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff6496', endColorstr='#fa8282',GradientType=1 );
color: #fff;
font-weight: 900;
}
/* side_bar
--------------------------------------------------------------------------------*/
/* side_contact
--------------------------------------------------------------------------------*/
#side_contact h3 {
margin-top: 24px;
font-family: "NSJP";
font-size: 0.85rem;
font-weight: 900;
line-height: 1.0;
letter-spacing: 0.02em;
}
#side_contact .item_contents .num {
font-family: "NSJP";
font-size: 1.6rem;
font-weight: 900;
line-height: 1.0;
letter-spacing: 0.02em;
}
#side_contact .item_contents .notes {
margin-top: 12px;
font-size: 0.8rem;
}
/* side_bar
--------------------------------------------------------------------------------*/
/* side_sns
--------------------------------------------------------------------------------*/
#side_sns ul {
margin: 12px auto 0 auto;
height: 60px;
width: 75%;
}
#side_sns li {
display: inline-block;
width: 33.3%;
}
#side_sns li a {
display: block;
margin: 0 auto;
width: 60px;
height: 60px;
border-radius: 50%;
text-align: center;
line-height: 60px;
}
#side_sns span {
position: relative;
display: block;
width: 60px;
height: 60px;
border-radius: 50%;
text-align: center;
line-height: 60px;
}
#side_sns span:after {
position: absolute;
top: 0;
left: 0;
width: 60px;
height: 60px;
color: #fff;
font-family: 'Font Awesome 5 Brands';
font-size: 2rem;
}
.fa_instagram {
background-color: #d22050;
}
.fa_instagram:hover {
background-color: #d2205033;
}
.fa_instagram:after {
content: '\f16d';
}
#side_sns .fa_instagram:hover:after {
color: #d22050;
}
.fa_twitter {
background-color: #1da1f2;
}
.fa_twitter:hover {
background-color: #1da1f233;
}
.fa_twitter:after {
content: '\f099';
}
#side_sns .fa_twitter:hover:after {
color: #1da1f2;
}
.fa_facebook {
background-color: #3b5998;
}
.fa_facebook:hover {
background-color: rgb(59 89 152 / 20%);
}
.fa_facebook:after {
content: '\f39e';
}
#side_sns .fa_facebook:hover:after {
color: #3b5998;
}
/* content_header
--------------------------------------------------------------------------------*/
/* type_01
--------------------------------------------------------------------------------*/
.type_01 .header_head {
background-color: transparent;
background-repeat: no-repeat;
}
.type_01 .header_head .wrapper {
padding: 24px 12px 24px 12px;
/* min-height: 140px; */
/* background: #f9f8f5; */
background: -moz-linear-gradient(left, #f9f8f5 60%, transparent 80%);
/* background: -webkit-linear-gradient(left, #f9f8f5 60%, transparent 80%); */
/* background: linear-gradient(to right, #f9f8f5 60%, transparent 80%); */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='transparent',GradientType=1 );
}
.type_01 h2 {
display: inline-block;
margin: 0;
padding: 0;
background-color: transparent;
text-align: center;
line-height: 1.2;
color: #333;
font-size: 4.8vw;
font-weight: bold;
text-align: left;
}
.type_01 h2 span {
display: inline-block;
}
.type_01 .head_txt {
margin-top: 18px;
}
.type_01 .header_lead {
padding: 24px 12px 12px 12px;
}
.type_01 p {
line-height: 1.4;
color: #333;
font-size: 0.95rem;
}
.type_01 .head_txt p {
margin-top: 0;
}
.type_01 .header_lead p:nth-of-type(1) {
margin-top: 0;
}
/* section_bnr
--------------------------------------------------*/
.section_bnr img {
width: 100%;
}
/*------------------------------------------------------------------------------*/
/* error
--------------------------------------------------------------------------------*/
.error main header {
padding: 12px 0 12px 0;
}
.error #main_contents {
background: #f5f5f5;
}
.error .section {
padding: 40px 12px 40px 12px;
background-color: #fff;
}
.error .section p {
margin-top: 20px;
}
.type_04 h2 {
position: relative;
display: inline-block;
margin: 0;
padding: 0 0 0 2.2rem;
background-color: transparent;
text-align: center;
line-height: 1.2;
color: #333;
font-size: 1.4rem;
font-weight: bold;
text-align: left;
}
.type_04 h2:before {
content: '\f071';
position: absolute;
top: 50%;
left: 0rem;
margin-top: -0.55rem;
color: #ff237d;
font-size: 1.0rem;
font-family: 'Font Awesome 5 Free';
font-weight: 900;
}
/*----------------------------------------------------------------------------*/
/* accordion
------------------------------------------------------------------------------*/
/* check
----------------------------------------------------------*/
.accordion_check {
display: none;
}
/* label
----------------------------------------------------------*/
.accordion_label {
display: block;
margin-top: 0 !important;
}
/* content
----------------------------------------------------------*/
.accordion_content {
overflow: hidden;
max-height: 0;
margin-top: 0 !important;
filter:alpha(opacity=0);
-moz-opacity: 0;
opacity: 0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.accordion_check:checked + label + .accordion_content {
max-height: 9999px;
filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
/* open_accordion
----------------------------------------------------------*/
.open_accordion .accordion_content {
max-height: 9999px !important;
filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}