@charset "UTF-8";
@import url("//fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;700&display=swap");
@keyframes bounce-up { 0% { transform: translateY(0); }
  16% { transform: translateY(-110%); }
  28% { transform: translateY(-92%); }
  44% { transform: translateY(-105%); }
  59% { transform: translateY(-98%); }
  73% { transform: translateY(-100%); }
  100% { transform: translateY(-100%); } }
@keyframes bounce-right { 0% { transform: translateY(0); }
  16% { transform: translateX(-108%); }
  28% { transform: translateX(-94%); }
  44% { transform: translateX(-104%); }
  59% { transform: translateX(-98%); }
  73% { transform: translateX(-100%); }
  100% { transform: translateX(-100%); } }
/* 主要なカラー
------------------------------ */
@font-face { font-family: 'myself'; src: url("/style/fonts/myself.eot"); src: url("/style/fonts/myself.eot#iefix") format("embedded-opentype"), url("/style/fonts/myself.woff") format("woff"), url("/style/fonts/myself.otf") format("opentype"); font-weight: normal; font-style: normal; font-display: swap; }
@font-face { font-family: 'icon'; src: url("/style/fonts/icon.eot"); src: url("/style/fonts/icon.eot#iefix") format("embedded-opentype"), url("/style/fonts/icon.woff") format("woff"), url("/style/fonts/icon.ttf") format("truetype"), url("/style/fonts/icon.svg") format("svg"); font-weight: normal; font-style: normal; font-display: swap; }
[class^="icon-"], [class*=" icon-"] { /* use !important to prevent issues with browser extensions that change fonts */ font-family: 'icon' !important; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon { width: 28px; height: 28px; }

.icon-menu01:before { content: "\e901"; }

.icon-menu02:before { content: "\e902"; }

.icon-menu03:before { content: "\e903"; }

.icon-menu04:before { content: "\e904"; }

.icon-menu05:before { content: "\e905"; }

.icon-menu06:before { content: "\e906"; }

.icon-menu07:before { content: "\e907"; }

.icon-menu08:before { content: "\e908"; }

.icon-plus:before { content: "\f067"; }

.icon-question:before { content: "\f128"; }

.icon-minus:before { content: "\f068"; }

.icon-search:before { content: "\f002"; }

.icon-mail:before { content: "\f003"; }

.icon-heart:before { content: "\f004"; }

.icon-check:before { content: "\f00c"; }

.icon-close:before { content: "\f00d"; }

.icon-home:before { content: "\f015"; }

.icon-list:before { content: "\f022"; }

.icon-pencil:before { content: "\f040"; }

.icon-map:before { content: "\f041"; }

.icon-edit:before { content: "\f044"; }

.icon-single-left:before { content: "\f053"; }

.icon-single-right:before { content: "\f054"; }

.icon-single-up:before { content: "\f077"; }

.icon-single-down:before { content: "\f078"; }

.icon-plus-c:before { content: "\f055"; }

.icon-minus-c:before { content: "\f056"; }

.icon-times-c:before { content: "\f057"; }

.icon-check-c:before { content: "\f058"; }

.icon-chart:before { content: "\f080"; }

.icon-thumbs:before { content: "\f087"; }

.icon-phone:before { content: "\f095"; }

.icon-horn:before { content: "\f0a1"; }

.icon-square:before { content: "\f0c8"; }

.icon-mail2:before { content: "\f0e0"; }

.icon-comments:before { content: "\f0e6"; }

.icon-light:before { content: "\f0eb"; }

.icon-double-left:before { content: "\f100"; }

.icon-double-right:before { content: "\f101"; }

.icon-double-up:before { content: "\f102"; }

.icon-double-down:before { content: "\f103"; }

.icon-angle-left:before { content: "\f104"; }

.icon-angle-right:before { content: "\f105"; }

.icon-angle-up:before { content: "\f106"; }

.icon-angle-down:before { content: "\f107"; }

.icon-circle:before { content: "\f111"; }

.icon-smile:before { content: "\f118"; }

.icon-left-c:before { content: "\f137"; }

.icon-right-c:before { content: "\f138"; }

.icon-up-c:before { content: "\f139"; }

.icon-down-c:before { content: "\f13a"; }

.icon-play-c:before { content: "\f144"; }

.icon-link:before { content: "\f14c"; }

.icon-share:before { content: "\f14d"; }

.icon-yen:before { content: "\f157"; }

.icon-send:before { content: "\f1d8"; }

.icon-map-pin:before { content: "\f276"; }

.icon-handshake:before { content: "\f2b5"; }

.icon-user:before { content: "\f2bd"; }

.icon-files:before { content: "\e925"; }

.icon-mobile:before { content: "\e958"; }

.icon-line:before { content: "\e900"; }

.icon-twitter:before { content: "\e909"; }

.icon-youtube:before { content: "\e90a"; }

.icon-arrow-cup:before { content: "\f0b1"; }

.icon-arrow-cright:before { content: "\f0b2"; }

.icon-arrow-cdown:before { content: "\f0b3"; }

.icon-arrow-cleft:before { content: "\f0b4"; }

.icon-arrow-up:before { content: "\f0b5"; }

.icon-arrow-right:before { content: "\f0b6"; }

.icon-arrow-down:before { content: "\f0b7"; }

.icon-arrow-left:before { content: "\f0b8"; }

.center { text-align: center; }

.right { text-align: right; }

.left { text-align: left; }

em, i { font-style: normal; }

em, .bold { font-style: normal; font-weight: 700; }

small, .small { font-size: 0.8em; }

sup, sub { font-size: 0.7em; }

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, tt, var, b, u, i, center, main, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; box-sizing: border-box; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

img { vertical-align: middle; max-width: 100%; height: auto; }

a { color: #4b93b4; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; text-decoration: none; }
a:hover { color: #ef7e17; text-decoration: none; }

header { width: 280px; height: 100vh; background: white; position: fixed; left: 0; top: 0; z-index: 99; padding-bottom: 64px; letter-spacing: 0; -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3); box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3); -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none; }
header::-webkit-scrollbar { display: none; }
@media (max-width: 1024px) { header { position: static; height: auto; padding-bottom: 0; } }

#logoarea { margin-bottom: 32px; }
@media (max-width: 1024px) { #logoarea { position: fixed; left: 0; top: 0; width: 100%; background: white; z-index: 10; -moz-box-shadow: 0px 1px 3px rgba(103, 80, 66, 0.2); -webkit-box-shadow: 0px 1px 3px rgba(103, 80, 66, 0.2); box-shadow: 0px 1px 3px rgba(103, 80, 66, 0.2); -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
  #logoarea.scroll { -moz-transform: translateY(-100%); -ms-transform: translateY(-100%); -webkit-transform: translateY(-100%); transform: translateY(-100%); }
  #logoarea.upscroll { top: -21px; } }
#logoarea .target { font-size: 12px; font-size: 0.75rem; margin: 0; padding: 0; }
#logoarea .target > em { display: block; text-align: center; background: #ef7e17; color: white; }
#logoarea .target i { display: block; text-align: center; color: #ef7e17; }
#logoarea .target span { display: none; }
@media (max-width: 1024px) { #logoarea .target { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
  #logoarea .target > em { display: none; }
  #logoarea .target span { display: block; padding: 0 0.3em; }
  #logoarea .target span em { color: #ef7e17; }
  #logoarea .target i { flex: 1; background: #fff570; color: #675042; } }
#logoarea #logo { padding-top: 8px; width: 90%; max-width: 1024px; margin: 24px auto; margin: 0 auto; }
@media (max-width: 1024px) { #logoarea #logo { width: 94%; max-width: 1024px; margin: 24px auto; margin: 0 auto; padding: 0; height: 56px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; }
  #logoarea #logo a { max-width: 64%; }
  #logoarea #logo img { width: 100%; } }

@media (max-width: 1024px) { #gnav { width: 100vw; height: 100vh; position: fixed; top: 0; left: 100vw; transition: all 0.6s cubic-bezier(0.19, 1, 0.22, 1); background: white; overflow: auto; padding-bottom: 96px; z-index: 11; }
  #gnav.open { left: 0; } }
#gnav .navlist { font-size: 15px; font-size: 0.9375rem; }
#gnav .navlist a, #gnav .navlist span { display: block; color: #675042; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; padding: 14px 16px; position: relative; line-height: 1.8; }
#gnav .navlist a::before, #gnav .navlist a::after, #gnav .navlist span::before, #gnav .navlist span::after { content: ""; display: block; background: #b2a7a0; position: absolute; }
#gnav .navlist a i, #gnav .navlist span i { font-size: 20px; font-size: 1.25rem; display: inline-block; width: 32px; margin-right: 4px; color: #ef7e17; line-height: 0; position: relative; text-align: center; top: 2px; }
#gnav .navlist a .icon-handshake, #gnav .navlist span .icon-handshake { font-size: 18px; font-size: 1.125rem; }
#gnav .navlist a::before, #gnav .navlist span::before { width: 2px; height: 10px; top: calc(50% - 4px); right: 20px; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
#gnav .navlist a::after, #gnav .navlist span::after { width: 10px; height: 2px; top: 50%; right: 16px; }
#gnav .navlist a:hover, #gnav .navlist span:hover { background: #fe9; }
#gnav .navlist a:hover::before, #gnav .navlist span:hover::before { -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; }
#gnav .navlist img { margin-right: 8px; vertical-align: bottom; }
#gnav .navlist span { cursor: help; }
#gnav .navlist .no_open a::before { content: none; }
#gnav .navlist .no_open a::after { content: "\f105"; font-family: icon; padding-right: 0em; line-height: 1; top: calc(50% - 0.5em); right: 16px; color: #b2a7a0; font-weight: bold; background: none; width: auto; height: auto; }
@media (max-width: 1024px) { #gnav .navlist { display: none; } }
#gnav .navbtn { display: none; }
@media (max-width: 1024px) { #gnav .navbtn { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; line-height: 1; height: 48px; }
  #gnav .navbtn span { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; height: 100%; color: #4b93b4; font-size: 38px; font-size: 2.375rem; padding: 0 0.4em; }
  #gnav .navbtn .home { position: block; max-width: 240px; width: 64%; margin: 0 8px; } }
#gnav .actionbtn { text-align: center; padding-bottom: 16px; }
#gnav .actionbtn li { padding-top: 8px; }
#gnav .trial { padding-top: 16px; text-align: center; }
#gnav .trial a { display: block; -moz-border-radius: 2em; -webkit-border-radius: 2em; border-radius: 2em; margin: 8px 16px; background: #fff570; -moz-box-shadow: 0px 2px 2px rgba(103, 80, 66, 0.3); -webkit-box-shadow: 0px 2px 2px rgba(103, 80, 66, 0.3); box-shadow: 0px 2px 2px rgba(103, 80, 66, 0.3); color: #ef7e17; padding: 4px 8px; font-weight: bold; position: relative; }
#gnav .trial a::after { content: "\f054"; font-family: icon; padding-right: 0em; line-height: 1; font-size: 16px; font-size: 1rem; position: absolute; top: calc(50% - 0.4em); right: 8px; padding: 0; font-weight: normal; }
#gnav .trial a:hover { background: #fe9; }
#gnav .tel a, #gnav .tel span { display: block; background: #ef7e17; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; margin: 8px 16px 0; padding: 8px 16px; }
#gnav .tel a.member, #gnav .tel span.member { background: #4b93b4; color: white; font-size: 20px; font-size: 1.25rem; margin-top: 32px; }
#gnav .tel a.member i, #gnav .tel span.member i { margin-right: 8px; }
#gnav .web a, #gnav .contact a { display: block; line-height: 1.2; font-size: 15px; font-size: 0.9375rem; position: relative; text-align: left; padding: 20px 16px 20px 56px; font-weight: bold; }
@media (max-width: 528px) { #gnav .web a, #gnav .contact a { border-left: 8px solid transparent; font-size: 16px; font-size: 1rem; } }
#gnav .web a small, #gnav .contact a small { font-weight: normal; }
#gnav .web a i, #gnav .contact a i { position: absolute; font-size: 20px; font-size: 1.25rem; top: calc(50% - 0.5em); left: 24px; }
#gnav .web a::before, #gnav .contact a::before { content: ""; display: block; height: 100%; width: 100%; position: absolute; top: 0; left: 0; -moz-transform: scaleX(0.04); -ms-transform: scaleX(0.04); -webkit-transform: scaleX(0.04); transform: scaleX(0.04); transform-origin: top left; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; z-index: -1; }
@media (max-width: 528px) { #gnav .web a::before, #gnav .contact a::before { content: none; } }
#gnav .web a::after, #gnav .contact a::after { content: "\f105"; font-family: icon; padding-right: 0em; line-height: 1; position: absolute; top: calc(50% - 0.5em); right: 16px; font-weight: normal; }
#gnav .web a.form, #gnav .contact a.form { color: #4b93b4; background: rgba(75, 147, 180, 0.1); }
@media (max-width: 528px) { #gnav .web a.form, #gnav .contact a.form { border-left-color: #4b93b4; } }
#gnav .web a.form::before, #gnav .contact a.form::before { background: #4b93b4; }
#gnav .web a.line, #gnav .contact a.line { color: #3cb900; background: rgba(60, 185, 0, 0.1); }
@media (max-width: 528px) { #gnav .web a.line, #gnav .contact a.line { border-left-color: #3cb900; } }
#gnav .web a.line::before, #gnav .contact a.line::before { background: #3cb900; }
#gnav .web a:hover, #gnav .contact a:hover { color: white; }
#gnav .web a:hover::before, #gnav .contact a:hover::before { -moz-transform: scaleX(1); -ms-transform: scaleX(1); -webkit-transform: scaleX(1); transform: scaleX(1); }
#gnav .contact { text-align: center; }
#gnav .contact a { color: #675042; background: rgba(103, 80, 66, 0.1); margin-top: 8px; }
@media (max-width: 528px) { #gnav .contact a { border-left-color: #675042; } }
#gnav .contact a::before { background: #675042; }
#gnav .otherlink { border-top: 1px solid #b2a7a0; margin-top: 32px; }
#gnav .otherlink li { border-bottom: 1px solid #b2a7a0; }
#gnav .otherlink a { display: block; color: #675042; font-size: 15px; font-size: 0.9375rem; padding: 12px 16px; background: url(/image/nav/sub_bg.webp); position: relative; }
#gnav .otherlink a::after { content: "\f105"; font-family: icon; padding-right: 0em; line-height: 1; font-size: 16px; font-size: 1rem; position: absolute; right: 16px; top: calc(50% - 0.5em); line-height: 1; }
@media (max-width: 528px) { #gnav .otherlink a { font-size: 16px; font-size: 1rem; } }

#menuopen { display: none; }
@media (max-width: 1024px) { #menuopen { background: #4b93b4; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; width: 64px; height: 56px; line-height: 1; position: absolute; right: 0; bottom: 0; } }
#menuopen i { font-size: 12px; font-size: 0.75rem; color: white; font-weight: bold; }
#menuopen span { display: block; width: 48%; height: 2px; background: white; position: relative; margin: 10px 0 12px 0; }
#menuopen span:before, #menuopen span:after { content: ""; width: 100%; height: 2px; background: white; position: absolute; left: 0; }
#menuopen span:before { top: -7px; }
#menuopen span:after { bottom: -7px; }

.close { display: none; }
@media (max-width: 1024px) { .close { display: block; text-align: center; margin-top: 16px; }
  .close .closebtn { display: inline-block; background: #4b93b4; color: white; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 0.6em 2.4em; cursor: pointer; }
  .close .closebtn i { margin-right: 0.6em; } }

.menuchild-box { position: fixed; top: 0; left: 280px; width: 240px; height: 100%; background: #fe9; visibility: hidden; opacity: 0; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; -moz-box-shadow: 2px 0px 2px rgba(103, 80, 66, 0.16); -webkit-box-shadow: 2px 0px 2px rgba(103, 80, 66, 0.16); box-shadow: 2px 0px 2px rgba(103, 80, 66, 0.16); z-index: 98; }
.menuchild-box.open { visibility: visible; opacity: 1; width: 380px; }
@media (max-width: 1024px) { .menuchild-box { position: static; visibility: visible; opacity: 1; width: 100%; height: auto; background: none; } }
.menuchild-box ul > li { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.menuchild-box ul > li.current { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; }
.menuchild-box ul > li > span { position: absolute; display: block; top: 0; left: 0; width: 100%; text-align: center; padding: 24px 8px 16px; color: #756154; line-height: 1.4; background: rgba(255, 255, 255, 0.4); }
.menuchild-box ul > li > span i { display: none; }
@media (max-width: 1024px) { .menuchild-box ul > li > span { position: static; display: block; color: #675042; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; padding: 14px 16px; position: relative; line-height: 1.8; text-align: left; }
  .menuchild-box ul > li > span::before, .menuchild-box ul > li > span::after { content: ""; display: block; background: #b2a7a0; position: absolute; }
  .menuchild-box ul > li > span i { font-size: 20px; font-size: 1.25rem; display: inline-block; width: 32px; margin-right: 4px; color: #ef7e17; line-height: 0; position: relative; text-align: center; top: 2px; }
  .menuchild-box ul > li > span .icon-handshake { font-size: 18px; font-size: 1.125rem; }
  .menuchild-box ul > li > span::before { width: 2px; height: 10px; top: calc(50% - 4px); right: 20px; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
  .menuchild-box ul > li > span::after { width: 10px; height: 2px; top: 50%; right: 16px; }
  .menuchild-box ul > li > span.tabopen { background: #fe9; }
  .menuchild-box ul > li > span.tabopen::before { -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } }
@media (max-width: 1024px) { .menuchild-box ul > li > a { display: block; color: #675042; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; padding: 14px 16px; position: relative; line-height: 1.8; }
  .menuchild-box ul > li > a::before, .menuchild-box ul > li > a::after { content: ""; display: block; background: #b2a7a0; position: absolute; }
  .menuchild-box ul > li > a i { font-size: 20px; font-size: 1.25rem; display: inline-block; width: 32px; margin-right: 4px; color: #ef7e17; line-height: 0; position: relative; text-align: center; top: 2px; }
  .menuchild-box ul > li > a .icon-handshake { font-size: 18px; font-size: 1.125rem; }
  .menuchild-box ul > li > a::before { width: 2px; height: 10px; top: calc(50% - 4px); right: 20px; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
  .menuchild-box ul > li > a::after { width: 10px; height: 2px; top: 50%; right: 16px; } }
@media (max-width: 1024px) { .menuchild-box ul > li { position: static; display: block; height: auto; } }
.menuchild-box ul > li.nochild a::before { content: none; }
.menuchild-box ul > li.nochild a::after { content: "\f105"; font-family: icon; padding-right: 0em; line-height: 1; top: calc(50% - 0.5em); right: 16px; color: #b2a7a0; font-weight: bold; background: none; width: auto; height: auto; }
.menuchild-box img { margin-right: 8px; vertical-align: bottom; }
.menuchild-box ol { padding: 0 16px; position: absolute; left: 0; width: 100%; }
@media (max-width: 1024px) { .menuchild-box ol { position: static; display: none; background: #fe9; } }
.menuchild-box ol a { display: block; line-height: 1.4; padding: 16px; padding-right: 24px; border-bottom: 1px solid white; font-size: 16px; font-size: 1rem; color: #675042; position: relative; }
.menuchild-box ol a small { display: block; color: #ef7e17; padding-top: 8px; }
.menuchild-box ol a::after { content: "\f105"; font-family: icon; padding-right: 0em; line-height: 1; position: absolute; top: calc(50% - 0.5em); right: 8px; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.menuchild-box ol a:hover { color: #ef7e17; }
.menuchild-box ol a:hover::after { color: #675042; right: 2px; }

html > img { position: absolute; }

body { font-family: 'Noto Sans JP', sans-serif; font-size: 18px; font-size: 1.125rem; line-height: 1.8; color: #675042; background: url(/image/common/bg.webp); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: justify; text-justify: inter-ideograph; }
body.fixed { position: fixed; }
@media (max-width: 528px) { body { font-size: 16px; font-size: 1rem; } }

main { margin-left: 280px; background: url(/image/common/head_bg.webp) repeat-x top; }
@media (max-width: 1024px) { main { margin-left: 0; } }

h1, h2, h3, h4, h5 { line-height: 1.4; }

.stage { width: 94%; max-width: 1024px; margin: 24px auto; max-width: 928px; margin: 64px auto; background: white; padding: 32px 0; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
.stage section, .stage .section { margin: 88px 0; width: auto; }
.stage section:first-child, .stage .section:first-child { margin-top: 0; }
.stage section:last-child, .stage .section:last-child { margin-bottom: 0; }
.stage h2 + .section, .stage h3 + .section { margin-top: 0; }
.stage.ontop { padding-top: 32px; }
.stage.ontop > .bnr:first-child { margin-top: 0; }
.stage.notop { padding-top: 0; overflow: hidden; }
.stage.parts { padding: 32px 64px; }
@media (max-width: 528px) { .stage { margin-top: 32px; } }

.sp { display: none; }
@media (max-width: 528px) { .sp { display: block; } }

.pc { display: block; }
@media (max-width: 528px) { .pc { display: none; } }

p { width: 94%; max-width: 1024px; margin: 24px auto; max-width: 800px; }

/*
*{
	&>p,&>.disc,&>.decimal{
		&:first-child{
			margin-top:0;
		}
	}
}
*/
#bread { font-size: 10px; font-size: 0.625rem; padding: 8px 16px; }
#bread span { display: inline-block; }
#bread span::before { content: "\003e"; margin: 0 0.6em; }
#bread span:first-child::before { content: none; }
@media (max-width: 528px) { #bread { visibility: hidden; padding: 0; }
  #bread span { display: none; }
  #bread span:first-child { display: inline-block; } }

@media (max-width: 528px) { h1#bread { display: none; } }

#blank { display: none; }
@media (max-width: 1024px) { #blank { display: block; margin-top: 21px; height: 56px; }
  #blank img { width: 100%; } }

.maxwidth { max-width: 1024px; margin: 24px auto; }

.side { margin: 24px 0; }
.side-no { margin: 24px 0; }
.side-high { margin: 24px 64px; }
@media (max-width: 528px) { .side-high { margin: 24px 12px; } }
.side-high p { margin: 24px 0; }
.side-mid { margin: 24px 32px; }
@media (max-width: 528px) { .side-mid { margin: 24px 12px; } }
.side-low { margin: 24px; }
@media (max-width: 528px) { .side-low { margin: 24px 12px; } }

footer { margin-left: 280px; background: white; padding-top: 16px; border-top: 3px solid #ef7e17; line-height: 1.4; font-size: 16px; font-size: 1rem; }
@media (max-width: 1024px) { footer { margin-left: 0; padding-top: 0; }
  footer.pc { display: none; }
  footer.sp { display: block; } }
footer nav { width: 94%; max-width: 1024px; margin: 24px auto; margin: 0 auto; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
footer nav.address { -webkit-align-items: center; align-items: center; }
footer dl { width: 25%; padding: 8px; }
footer dl a { color: #675042; }
footer dt { border-left: 6px solid #ef7e17; font-weight: bold; padding-left: 0.6em; margin-bottom: 0.6em; }
footer dd { padding: 0 0 16px 16px; }
footer dd a { display: block; color: #675042; padding: 0 0.6em; font-size: 0.9em; margin-top: 0.4em; }
footer .entrybox { padding: 16px 0; }
footer .entrybox a { display: block; width: 94%; max-width: 1024px; margin: 24px auto; color: white; text-align: center; padding: 0.8em; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
footer .entrybox.entry { background: #fffdfc; }
footer .entrybox.entry a { background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y0YTg2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2VmN2UxNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f4a863), color-stop(100%, #ef7e17)); background: -moz-linear-gradient(#f4a863, #ef7e17); background: -webkit-linear-gradient(#f4a863, #ef7e17); background: linear-gradient(#f4a863, #ef7e17); }
footer .entrybox.customer { background: #ecf9f7; }
footer .entrybox.customer a { background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUxYzhiYiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzMwOTc4YyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #51c8bb), color-stop(100%, #30978c)); background: -moz-linear-gradient(#51c8bb, #30978c); background: -webkit-linear-gradient(#51c8bb, #30978c); background: linear-gradient(#51c8bb, #30978c); }
footer .about { width: 94%; max-width: 1024px; margin: 24px auto; margin: 0 auto 16px; }
footer .about li { border-bottom: 1px dotted #675042; }
footer .about a { display: block; padding: 0.8em 1.6em; color: #675042; font-size: 0.9em; }
footer address { font-size: 0.9em; padding: 8px 0; font-style: normal; }
@media (max-width: 528px) { footer address { padding: 0 1em; } }
footer .infomation { width: 94%; max-width: 1024px; margin: 24px auto; margin: 16px auto 0; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
footer .enquete { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
footer .enquete li { padding: 4px; }
footer .enquete li:last-child a { background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUxYzhiYiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzMwOTc4YyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #51c8bb), color-stop(100%, #30978c)); background: -moz-linear-gradient(#51c8bb, #30978c); background: -webkit-linear-gradient(#51c8bb, #30978c); background: linear-gradient(#51c8bb, #30978c); border: 1px solid #26786f; color: white; }
footer .enquete a { display: block; padding: 0.6em 1em; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; text-align: center; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y0YTg2MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2VmN2UxNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f4a863), color-stop(100%, #ef7e17)); background: -moz-linear-gradient(#f4a863, #ef7e17); background: -webkit-linear-gradient(#f4a863, #ef7e17); background: linear-gradient(#f4a863, #ef7e17); border: 1px solid #ef7e17; color: white; }
footer .enquete a:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80); opacity: 0.8; }
footer .navlist { display: none; }

#copy { text-align: center; background: white; font-size: 14px; font-size: 0.875rem; margin: 0; padding: 2.4em 0 1em; width: auto; max-width: none; }
@media (max-width: 1024px) { #copy { padding-bottom: 72px; } }

#fixdevice { display: none; background: white; -moz-box-shadow: 0px -1px 3px rgba(103, 80, 66, 0.3); -webkit-box-shadow: 0px -1px 3px rgba(103, 80, 66, 0.3); box-shadow: 0px -1px 3px rgba(103, 80, 66, 0.3); line-height: 1; padding: 8px 4px; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 101; font-size: 14px; font-size: 0.875rem; }
@media (max-width: 1024px) { #fixdevice { display: block; } }
#fixdevice ul { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
#fixdevice li { width: 50%; padding: 0 4px; }
@media (max-width: 528px) { #fixdevice li { width: auto; } }
#fixdevice a { line-height: 1.4; height: 52px; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; }
#fixdevice .tel a { border: 2px solid #4b93b4; padding: 0 8px; text-align: center; }
#fixdevice .tel a i { text-align: center; font-size: 12px; font-size: 0.75rem; }
#fixdevice .tel a i::before { display: block; font-size: 22px; font-size: 1.375rem; color: #675042; margin-bottom: 4px; }
#fixdevice .tel a small { flex: 1; }
@media (max-width: 528px) { #fixdevice .tel a small { display: none; } }
#fixdevice .tel a em { font-size: 1.2em; }
#fixdevice .tel.trialpage { width: 50%; }
@media (max-width: 528px) { #fixdevice .tel.trialpage a small { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; -webkit-flex-direction: column; flex-direction: column; } }
@media (max-width: 528px) { #fixdevice .trial { flex: 1; } }
#fixdevice .trial a { background: #ef7e17; color: white; position: relative; -webkit-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; }
#fixdevice .trial a::after { content: "\f054"; font-family: icon; position: absolute; top: calc(50% - 0.5em); right: 3%; }
#fixdevice.trialpage { font-size: 16px; font-size: 1rem; }
#fixdevice.trialpage li { width: auto; flex: 1; }
#fixdevice.trialpage li a { color: white; -webkit-justify-content: center; justify-content: center; height: 40px; }
#fixdevice.trialpage li i { margin-right: 4px; font-size: 24px; font-size: 1.5rem; }
#fixdevice.trialpage li.trialtel a { background: #ef7e17; }
#fixdevice.trialpage li.line a { background: #3cb900; }
#fixdevice.trialpage li.form a { background: #4b93b4; }

.telinfo { display: none; /*
	a{
		line-height:1.3;
		display:block;
		position:relative;
		@include radius;
		padding:16px;
		padding-left:52px;
		&.trial{
			background:$orange;
			color:white;
		}
		&.member{
			background:$blue;
			color:white;
		}
		i{
			@include fz(30);
			position:absolute;
			line-height:1;
			top:calc(50% - 0.5em);
			left:16px;
		}
		em{
			@include fz(20);
		}
	}
	small{
		display:block;
		@include fz(12);
	}
	div{
		padding:16px 4px;
	}
*/ }

@keyframes totop_hover { 0% { -moz-transform: translateY(0); -ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); }
  100% { -moz-transform: translateY(-1px); -ms-transform: translateY(-1px); -webkit-transform: translateY(-1px); transform: translateY(-1px); } }
@keyframes totop_push { 0% { bottom: -98px; }
  100% { bottom: 120%; } }
@keyframes totop_pushsp { 0% { bottom: -64px; }
  100% { bottom: 120%; } }
#totop { position: fixed; right: 1%; bottom: -230px; animation: none; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; z-index: 9; }
#totop.show { bottom: -98px; }
@media (max-width: 528px) { #totop.show { bottom: -64px; } }
#totop a { display: block; animation: none; }
#totop a:hover { animation: totop_hover 0.1s infinite; }
@media (max-width: 528px) { #totop a:hover { animation: none; } }
#totop.push { animation: totop_push 0.6s cubic-bezier(0.3, 0, 1, 0.3) backwards; }
@media (max-width: 528px) { #totop.push { animation: totop_pushsp 0.6s cubic-bezier(0.3, 0, 1, 0.3) backwards; } }

[class^="tag-"], [class*=" tag-"], [class^="title-tag-"], [class*=" title-tag-"] { text-align: left; padding: 0.6em; font-weight: bold; font-size: 1.1em; line-height: 1.4; border-left-width: 14px; border-style: solid; }
[class^="tag-"] small, [class^="tag-"] span, [class*=" tag-"] small, [class*=" tag-"] span, [class^="title-tag-"] small, [class^="title-tag-"] span, [class*=" title-tag-"] small, [class*=" title-tag-"] span { color: #75bacc; }
[class^="tag-"].note, [class*=" tag-"].note, [class^="title-tag-"].note, [class*=" title-tag-"].note { padding: 0 8px; }

.tag-red, .title-tag-red { border-color: #ef7e17; }

.tag-pink, .title-tag-pink { border-color: #f5c598; }

.tag-yellow, .title-tag-yellow { border-color: #fff570; }

.tag-blue, .title-tag-blue { border-color: #4b93b4; }

.tag-apple, .title-tag-apple { border-color: #75bacc; }

.tag-orange, .title-tag-orange { border-color: #ef7e17; }

.tag-brown, .title-tag-brown { border-color: #675042; }

[class^="bgtitle-"], [class*=" bgtitle-"] { width: 94%; max-width: 1024px; margin: 24px auto; padding: 0.8em 0.6em 0.6em; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; font-size: 1.2em; font-weight: bold; text-align: center; line-height: 1.6; }
@media (max-width: 528px) { [class^="bgtitle-"], [class*=" bgtitle-"] { width: 100%; font-size: 1.1em; } }

.bgtitle-orange { background: #ef7e17; color: white; }

.bgtitle-light { background: #fef5ee; color: #ef7e17; }

.bgtitle-blue { background: #4b93b4; color: white; }

.bgtitle-apple { background: #e5f2f5; }

.bgtitle-brown { background: #675042; color: white; }

[class^="dot-"], [class*=" dot-"] { width: 94%; max-width: 1024px; margin: 24px auto; margin-bottom: 32px; border-top: 2px dashed #fff; border-bottom: 2px dashed #fff; line-height: 1.4; font-weight: bold; font-size: 1.2em; padding: 0.6em 1em; text-align: left; position: relative; top: 16px; }
[class^="dot-"] span, [class*=" dot-"] span { background: white; padding: 0 0.2em; color: #ef7e17; }
@media (max-width: 528px) { [class^="dot-"], [class*=" dot-"] { width: 100%; font-size: 1.1em; } }

.dot-cream { -moz-box-shadow: 0 5px 0 #f8e6a5, 0 -5px 0 #f8e6a5; -webkit-box-shadow: 0 5px 0 #f8e6a5, 0 -5px 0 #f8e6a5; box-shadow: 0 5px 0 #f8e6a5, 0 -5px 0 #f8e6a5; background: #f8e6a5; }

.dot-apple { -moz-box-shadow: 0 5px 0 #75bacc, 0 -5px 0 #75bacc; -webkit-box-shadow: 0 5px 0 #75bacc, 0 -5px 0 #75bacc; box-shadow: 0 5px 0 #75bacc, 0 -5px 0 #75bacc; background: #75bacc; color: white; }

.dot-pink { -moz-box-shadow: 0 5px 0 #f5c598, 0 -5px 0 #f5c598; -webkit-box-shadow: 0 5px 0 #f5c598, 0 -5px 0 #f5c598; box-shadow: 0 5px 0 #f5c598, 0 -5px 0 #f5c598; background: #f5c598; }

.dot-blue { -moz-box-shadow: 0 5px 0 #4b93b4, 0 -5px 0 #4b93b4; -webkit-box-shadow: 0 5px 0 #4b93b4, 0 -5px 0 #4b93b4; box-shadow: 0 5px 0 #4b93b4, 0 -5px 0 #4b93b4; background: #4b93b4; }

.dot-brown { -moz-box-shadow: 0 5px 0 #675042, 0 -5px 0 #675042; -webkit-box-shadow: 0 5px 0 #675042, 0 -5px 0 #675042; box-shadow: 0 5px 0 #675042, 0 -5px 0 #675042; background: #675042; color: white; }

/* h1 style
-------------------------------------- */
.title-flag, .title-h1 { font-size: 18px; font-size: 1.125rem; text-align: center; position: relative; margin-top: 32px; margin-bottom: 64px; line-height: 1.4; font-weight: bold; }
@media (max-width: 528px) { .title-flag, .title-h1 { font-size: 15px; font-size: 0.9375rem; margin-top: 12px; margin-bottom: 16px; padding: 0 0.6em; letter-spacing: 0; } }
.title-flag::before, .title-h1::before { content: url(/image/common/headline/flag.webp); display: block; width: 100%; text-align: center; position: absolute; bottom: 100%; left: 0; }

.title-head { font-size: 24px; font-size: 1.5rem; padding: 4px 16px; text-align: left; line-height: 1.4; font-weight: bold; }
@media (max-width: 528px) { .title-head { font-size: 16px; font-size: 1rem; } }

/* アーカイブページタイトル
-------------------------------------- */
.title-info01, .title-info02, .title-info03, .title-info04 { margin: 24px; font-weight: bold; line-height: 1.4; }
@media (max-width: 528px) { .title-info01, .title-info02, .title-info03, .title-info04 { margin: 24px 12px; } }

.title-line, .title-info01 { margin-bottom: 32px; padding-bottom: 16px; position: relative; font-size: 32px; font-size: 2rem; text-align: center; }
@media (max-width: 528px) { .title-line, .title-info01 { font-size: 20px; font-size: 1.25rem; } }
.title-line:after, .title-info01:after { content: ""; display: block; width: 64px; height: 0; border: 1px solid #75bacc; position: absolute; top: 100%; left: calc(50% - 32px); }
.title-line small, .title-info01 small { display: block; font-size: 16px; font-size: 1rem; font-weight: normal; }

.title-stripe, .title-info02 { padding: 0 16px 16px; position: relative; font-size: 28px; font-size: 1.75rem; }
@media (max-width: 528px) { .title-stripe, .title-info02 { font-size: 20px; font-size: 1.25rem; } }
.title-stripe::after, .title-info02::after { content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 16px; background-image: repeating-linear-gradient(-45deg, #4b93b4, #4b93b4 1px, transparent 1px, transparent 6px); }
.title-stripe small, .title-info02 small { display: block; font-size: 16px; font-size: 1rem; font-weight: normal; }
.title-stripe img, .title-info02 img { padding-right: 8px; }

.title-info03 { font-size: 22px; font-size: 1.375rem; position: relative; padding: 32px 16px 0 24px; background: url(/image/common/headline/info03-blue.webp) no-repeat left top; min-height: 56px; }
.title-info03.yellow { background-image: url(/image/common/headline/info03-yellow.webp); color: #675042; }

.title-info04 { background: url(/image/common/headline/info04.webp) no-repeat left 16px; padding-left: 42px; color: #4b93b4; font-size: 22px; font-size: 1.375rem; }

/* 記事ページタイトル
-------------------------------------- */
.title-border, .title-post01 { background: url(/image/common/headline/post01_head.webp) repeat-x top, url(/image/common/headline/post01_foot.webp) repeat-x bottom; margin: 24px; font-size: 24px; font-size: 1.5rem; font-weight: bold; line-height: 1.4; text-align: center; padding: 1.2em 0.8em; }
@media (max-width: 528px) { .title-border, .title-post01 { margin: 24px 12px; } }
@media (max-width: 528px) { .title-border, .title-post01 { font-size: 22px; font-size: 1.375rem; text-align: left; margin: 24px 0; } }

.title-postit, .title-post02 { margin: 24px; background: url(/image/common/headline/post02_bg.webp); padding: 1.2em 0.8em 1.2em 48px; font-size: 22px; font-size: 1.375rem; font-weight: bold; line-height: 1.4; position: relative; }
@media (max-width: 528px) { .title-postit, .title-post02 { margin: 24px 12px; } }
.title-postit::before, .title-post02::before { content: url(/image/common/headline/post02_img.webp); position: absolute; top: calc(50% - 15px); left: 8px; }
@media (max-width: 528px) { .title-postit, .title-post02 { font-size: 20px; font-size: 1.25rem; text-align: left; margin: 24px; } }
@media (max-width: 528px) and (max-width: 528px) { .title-postit, .title-post02 { margin: 24px 12px; } }

.title-post03 { margin: 24px; color: #ef7e17; font-weight: bold; font-size: 20px; font-size: 1.25rem; line-height: 1.4; padding: 0.8em; background: url(/image/common/headline/post03_bg.webp) repeat-x bottom; }
@media (max-width: 528px) { .title-post03 { margin: 24px 12px; } }
@media (max-width: 528px) { .title-post03 { font-size: 18px; font-size: 1.125rem; margin: 24px 0; } }

.title-post04 { margin: 24px 32px; font-weight: bold; font-size: 20px; font-size: 1.25rem; line-height: 1.4; background: url(/image/common/headline/post04_img.webp) no-repeat left 4px; padding-left: 22px; }
@media (max-width: 528px) { .title-post04 { margin: 24px 12px; } }
@media (max-width: 528px) { .title-post04 { font-size: 18px; font-size: 1.125rem; margin: 24px; } }
@media (max-width: 528px) and (max-width: 528px) { .title-post04 { margin: 24px 12px; } }

.title-post05 { width: 94%; max-width: 1024px; margin: 24px auto; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 16px; position: relative; font-size: 22px; font-size: 1.375rem; text-align: center; font-weight: bold; }
.title-post05::after { content: ""; display: block; width: 0; height: 0; border: 16px solid transparent; border-top-color: #675042; position: absolute; top: 100%; left: calc(50% - 16px); }

.title-bgstripe { margin: 24px 0; padding: 0.8em 1.2em; background: url(/image/common/line/dash-brown.webp) repeat-x center 4%, url(/image/common/line/dash-brown.webp) repeat-x center 96%, url(/image/common/headline/stripe-yellow.webp) repeat; font-size: 20px; font-size: 1.25rem; font-weight: bold; line-height: 1.4; }

.title-balloon { width: 94%; max-width: 1024px; margin: 24px auto; background: #ef7e17; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; position: relative; font-weight: bold; text-align: center; padding: 16px; color: white; line-height: 1.4; font-size: 22px; font-size: 1.375rem; }
.title-balloon span { font-size: 26px; font-size: 1.625rem; }
.title-balloon small { font-weight: normal; display: block; }
.title-balloon:after { content: ""; display: block; width: 0; height: 0; border: 10px solid transparent; border-top-color: #ef7e17; position: absolute; top: 100%; left: calc(50% - 16px); }
@media (max-width: 528px) { .title-balloon { width: 100%; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; } }

.title-penta { background: url(/image/common/headline/penta_bg.webp) no-repeat center bottom; position: relative; text-align: center; line-height: 1.6; font-weight: bold; font-size: 1.2em; padding: 32px 16px 48px; color: white; }
.title-penta:before, .title-penta:after { content: ""; display: block; position: absolute; left: 0; z-index: 3; height: 4px; width: 100%; background: white; }
.title-penta:before { top: 8px; }
.title-penta:after { top: 20px; }

.inner { max-width: 1024px; margin: 0 auto; }

.bnr { text-align: center; margin: 32px 0; }
@media (max-width: 528px) { .bnr { margin: 32px 8px; } }

.radius { -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }

/* new style
-------------------------------------- */
[class^="box-"], [class*=" box-"] { width: 94%; max-width: 1024px; margin: 24px auto; padding: 16px; }
@media (max-width: 528px) { [class^="box-"], [class*=" box-"] { padding: 8px 16px; } }
[class^="box-"] p, [class^="box-"] .tri, [class^="box-"] .img-right.img-right, [class^="box-"] .img-left.img-left, [class^="box-"] .disc.disc, [class^="box-"] .decimal.decimal, [class^="box-"] .list-star.list-star, [class^="box-"] .imgbox.imgbox, [class^="box-"] .list-check.list-check, [class^="box-"] .checkdl.checkdl, [class*=" box-"] p, [class*=" box-"] .tri, [class*=" box-"] .img-right.img-right, [class*=" box-"] .img-left.img-left, [class*=" box-"] .disc.disc, [class*=" box-"] .decimal.decimal, [class*=" box-"] .list-star.list-star, [class*=" box-"] .imgbox.imgbox, [class*=" box-"] .list-check.list-check, [class*=" box-"] .checkdl.checkdl { width: auto; }

[class^="box-dot-"], [class*=" box-dot-"] { -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; border: 3px dotted #b19e92; }
[class^="box-dot-"] p:first-child, [class^="box-dot-"] ul:first-child, [class^="box-dot-"] ol:first-child, [class^="box-dot-"] dl:first-child, [class^="box-dot-"] li:first-child, [class^="box-dot-"] table:first-child, [class^="box-dot-"] div:first-child, [class*=" box-dot-"] p:first-child, [class*=" box-dot-"] ul:first-child, [class*=" box-dot-"] ol:first-child, [class*=" box-dot-"] dl:first-child, [class*=" box-dot-"] li:first-child, [class*=" box-dot-"] table:first-child, [class*=" box-dot-"] div:first-child { padding-top: 0; }
@media (max-width: 528px) { [class^="box-dot-"], [class*=" box-dot-"] { padding: 8px 16px; } }

.box-dot-yellow { background: #fff3bc; }

.box-dot-blue { background: #f2fcff; border: 3px dotted #a1c7d8; }

.box-dot-white { background: none; border-color: #baa193; }

.box-shadow { position: relative; padding: 32px; margin: 0 auto 40px; background: white; background: url(/image/parts/box-shadow/bg.webp) center top; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; position: relative; }
.box-shadow::before { content: ""; display: block; position: absolute; top: 16px; left: 16px; width: calc(100% - 32px); height: calc(100% - 32px); background: white; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; z-index: 1; }
@media (max-width: 528px) { .box-shadow::before { width: calc(100% - 24px); height: calc(100% - 24px); top: 12px; left: 12px; } }
.box-shadow * { position: relative; z-index: 2; }
.box-shadow.img { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; }
.box-shadow.img > div, .box-shadow.img > p { flex: 1; }
@media (max-width: 528px) { .box-shadow.img { display: block; text-align: center; }
  .box-shadow.img > div, .box-shadow.img > p { text-align: left; } }
.box-shadow .disc, .box-shadow .decimal, .box-shadow .list-check, .box-shadow .list-star, .box-shadow .list-check { width: auto; }

[class^="box-bg-"], [class*=" box-bg-"] { -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; background: #fcf6db; }
@media (min-width: 529px) { [class^="box-bg-"], [class*=" box-bg-"] { font-size: 0.9em; } }

.box-bg-yellow { background: #fcf6db; }

.box-bg-orange { background: #fee7d1; }

.box-bg-white { background: #fff; }

[class^="box-border-"], [class*=" box-border-"] { -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; border: 3px solid #ef7e17; }

.box-border-blue { border-color: #4b93b4; }

.box-border-orange { border-color: #ef7e17; }

.box-border-brown { border-color: #d9ccc4; }

.box-memo { border-top: solid 10px #f3a45b; -moz-box-shadow: 0px 2px 2px rgba(103, 80, 66, 0.2); -webkit-box-shadow: 0px 2px 2px rgba(103, 80, 66, 0.2); box-shadow: 0px 2px 2px rgba(103, 80, 66, 0.2); }
.box-memo .title { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; line-height: 1.4; }
.box-memo .title p { flex: 1; margin: 0; }
.box-memo .title img { margin: 0 8px; }
.box-memo .disc { margin: 24px 64px; }
@media (max-width: 528px) { .box-memo .disc { margin: 24px 12px; } }
.box-memo .disc li { margin-left: 16px; }
.box-memo p { line-height: 1.6; }

.box-consul { border: 14px solid; border-image: url(/image/parts/box-consul/bg.webp) 16 repeat; padding: 32px; margin-top: 80px; position: relative; background: white; }
@media (max-width: 528px) { .box-consul { width: 94%; max-width: 1024px; margin: 24px auto; margin: 32px auto; padding: 16px; } }
.box-consul::before, .box-consul::after { content: ""; display: block; width: 80px; height: 0; border: 1px solid #b2a7a0; position: absolute; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }
@media (max-width: 528px) { .box-consul::before, .box-consul::after { content: none; } }
.box-consul::before { top: 0; left: -40px; }
.box-consul::after { bottom: 0; right: -40px; }
.box-consul dt { font-size: 1.2em; font-weight: bold; line-height: 1.3; }
.box-consul dd { margin-top: 16px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-align-items: center; align-items: center; }
@media (max-width: 768px) { .box-consul dd { -webkit-flex-direction: column-reverse; flex-direction: column-reverse; } }
.box-consul dd > div, .box-consul dd > p { flex: 1; }
.box-consul dd > img { max-width: 32%; margin: 0 8px; }
@media (max-width: 768px) { .box-consul dd > img { max-width: 80%; } }
.box-consul p { margin: 24px auto 0; font-size: 0.9em; }
.box-consul p:first-of-type { margin-top: 0; }
.box-consul p:last-of-type { margin-bottom: 0; }
.box-consul .img-right, .box-consul .img-left { width: 100%; margin: 24px 0 0; }
.box-consul .bnr { margin: 24px 0 0; }

.box-ringnote { padding-top: 32px; background: url(/image/parts/ringnote/bg.webp) no-repeat center top/contain #fcf6db; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; font-size: 0.9em; }
@media (max-width: 528px) { .box-ringnote { padding-top: 16px; } }
.box-ringnote .flex { justify-content: center; margin-bottom: 0; }
.box-ringnote .flex li, .box-ringnote .flex div { text-align: center; margin-bottom: 0; }

.img-left, .img-right { width: 94%; max-width: 1024px; margin: 24px auto; }
.img-left > img, .img-left > picture, .img-right > img, .img-right > picture { max-width: 42%; margin: 12px; }
.img-left > picture img, .img-right > picture img { max-width: 100%; }
.img-left p, .img-left .disc, .img-left .list-star, .img-right p, .img-right .disc, .img-right .list-star { width: auto; }
.img-left p:first-of-type, .img-left .disc:first-of-type, .img-left .list-star:first-of-type, .img-right p:first-of-type, .img-right .disc:first-of-type, .img-right .list-star:first-of-type { margin-top: 0; }
.img-left p:last-of-type, .img-left .disc:last-of-type, .img-left .list-star:last-of-type, .img-right p:last-of-type, .img-right .disc:last-of-type, .img-right .list-star:last-of-type { margin-bottom: 0; }
.img-left:after, .img-right:after { content: ""; display: block; clear: both; }
@media (max-width: 528px) { .img-left, .img-right { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-flex-direction: column; flex-direction: column; -webkit-align-items: center; align-items: center; }
  .img-left p, .img-right p { width: 100%; margin: 24px 0; }
  .img-left > img, .img-right > img { max-width: 86%; margin: 8px 0; }
  .img-left > picture, .img-right > picture { max-width: 86%; }
  .img-left > img, .img-left > picture, .img-right > img, .img-right > picture { float: none; -webkit-box-ordinal-group: 100; -moz-box-ordinal-group: 100; -ms-flex-order: 100; -webkit-order: 100; order: 100; }
  .img-left.reverse img, .img-left.reverse picture, .img-right.reverse img, .img-right.reverse picture { -webkit-box-ordinal-group: unset; -moz-box-ordinal-group: unset; -ms-flex-order: unset; -webkit-order: unset; order: unset; } }

.img-left > img, .img-left > picture { float: left; }
@media (max-width: 528px) { .img-left.side img { float: left; } }

.img-right > img, .img-right > picture { float: right; }
@media (max-width: 528px) { .img-right.side img { float: right; } }

.imgbox { width: 94%; max-width: 1024px; margin: 24px auto; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; max-width: 800px; }
.imgbox > div, .imgbox > img, .imgbox > picture { max-width: 42%; margin: 12px; }
.imgbox > p, .imgbox > ul, .imgbox > div { flex: 1; }
.imgbox p { width: auto; }
.imgbox p:first-of-type { margin-top: 0; }
.imgbox p:last-of-type { margin-bottom: 0; }
@media (max-width: 528px) { .imgbox { -webkit-flex-direction: column; flex-direction: column; }
  .imgbox > div, .imgbox > img, .imgbox > picture { max-width: 100%; }
  .imgbox p { margin-top: 0; margin-bottom: 32px; } }

.balloon { width: 94%; max-width: 1024px; margin: 24px auto; max-width: 800px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; -webkit-flex-direction: row-reverse; flex-direction: row-reverse; }
.balloon > img { max-width: 26%; }
.balloon > p, .balloon > div { flex: 1; background: #e8f4f9; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; position: relative; line-height: 1.6; }
.balloon > p:after, .balloon > div:after { content: ""; display: block; width: 0; height: 0; position: absolute; border: 12px solid transparent; left: 100%; border-color: transparent; border-left-color: #e8f4f9; top: calc(50% - 12px); }
.balloon p { margin: 0; padding: 16px 32px; }
.balloon.yellowbox > p, .balloon.yellowbox > div { background: #fff3bc; }
.balloon.yellowbox > p:after, .balloon.yellowbox > div:after { border-color: transparent; border-left-color: #fff3bc; }
.balloon.pinkbox > p, .balloon.pinkbox > div { background: #fee7d1; }
.balloon.pinkbox > p:after, .balloon.pinkbox > div:after { border-color: transparent; border-left-color: #fee7d1; }
.balloon.whitebox > p, .balloon.whitebox > div { background: white; }
.balloon.whitebox > p:after, .balloon.whitebox > div:after { border-color: transparent; border-left-color: white; }
.balloon.leftside { -webkit-flex-direction: row; flex-direction: row; }
.balloon.leftside > p, .balloon.leftside > div { margin: 0 0 0 16px; }
.balloon.leftside > p:after, .balloon.leftside > div:after { left: auto; right: 100%; border-color: transparent; border-right-color: #e8f4f9; }
.balloon.leftside.yellowbox > p:after, .balloon.leftside.yellowbox > div:after { border-color: transparent; border-right-color: #fff3bc; }
.balloon.leftside.pinkbox > p:after, .balloon.leftside.pinkbox > div:after { border-color: transparent; border-right-color: #fee7d1; }
.balloon.leftside.whitebox > p:after, .balloon.leftside.whitebox > div:after { border-color: transparent; border-right-color: white; }
.balloon.upside { -webkit-flex-direction: column; flex-direction: column; }
@media (max-width: 528px) { .balloon.upside > img { max-width: 60%; } }
.balloon.upside > p, .balloon.upside > div { margin: 16px 0 0 0; }
.balloon.upside > p:after, .balloon.upside > div:after { border-left-color: transparent; border-bottom-color: #e8f4f9; left: calc(50% - 12px); top: auto; bottom: 100%; }
.balloon.upside.yellowbox > p:after, .balloon.upside.yellowbox > div:after { border-color: transparent; border-bottom-color: #fff3bc; }
.balloon.upside.pinkbox > p:after, .balloon.upside.pinkbox > div:after { border-color: transparent; border-bottom-color: #fee7d1; }
.balloon.upside.whitebox > p:after, .balloon.upside.whitebox > div:after { border-color: transparent; border-bottom-color: white; }
.balloon.downside { -webkit-flex-direction: column-reverse; flex-direction: column-reverse; }
@media (max-width: 528px) { .balloon.downside > img { max-width: 60%; } }
.balloon.downside > p, .balloon.downside > div { margin: 0 0 16px 0; }
.balloon.downside > p:after, .balloon.downside > div:after { left: auto; top: 100%; border-color: transparent; border-top-color: #e8f4f9; left: calc(50% - 12px); }
.balloon.downside.yellowbox > p:after, .balloon.downside.yellowbox > div:after { border-color: transparent; border-top-color: #fff3bc; }
.balloon.downside.pinkbox > p:after, .balloon.downside.pinkbox > div:after { border-color: transparent; border-top-color: #fee7d1; }
.balloon.downside.whitebox > p:after, .balloon.downside.whitebox > div:after { border-color: transparent; border-top-color: white; }
@media (max-width: 528px) { .balloon.spup { -webkit-flex-direction: column; flex-direction: column; }
  .balloon.spup > img { max-width: 60%; }
  .balloon.spup > p, .balloon.spup > div { margin: 16px 0 0 0; }
  .balloon.spup > p:after, .balloon.spup > div:after { left: auto; bottom: 100%; border-color: transparent; border-bottom-color: #e8f4f9; top: auto; left: calc(50% - 12px); }
  .balloon.spup.yellowbox > p:after, .balloon.spup.yellowbox > div:after { border-color: transparent; border-bottom-color: #fff3bc; }
  .balloon.spup.pinkbox > p:after, .balloon.spup.pinkbox > div:after { border-color: transparent; border-bottom-color: #fee7d1; }
  .balloon.spup.whitebox > p:after, .balloon.spup.whitebox > div:after { border-color: transparent; border-bottom-color: white; }
  .balloon.spdown { -webkit-flex-direction: column-reverse; flex-direction: column-reverse; }
  .balloon.spdown > img { max-width: 60%; }
  .balloon.spdown > p, .balloon.spdown > div { margin: 0 0 16px 0; }
  .balloon.spdown > p:after, .balloon.spdown > div:after { left: auto; top: 100%; border-color: transparent; border-top-color: #e8f4f9; left: calc(50% - 12px); }
  .balloon.spdown.yellowbox > p:after, .balloon.spdown.yellowbox > div:after { border-color: transparent; border-top-color: #fff3bc; }
  .balloon.spdown.pinkbox > p:after, .balloon.spdown.pinkbox > div:after { border-color: transparent; border-top-color: #fee7d1; }
  .balloon.spdown.whitebox > p:after, .balloon.spdown.whitebox > div:after { border-color: transparent; border-top-color: white; } }

/* align -----------
----------------------------- */
.center { text-align: center; }

.right { text-align: right; }

.left { text-align: left; }

/* size -----------
----------------------------- */
.big.big { font-size: 1.2em; font-weight: bold; line-height: 1.6; }

.bigger.bigger { font-size: 1.4em; font-weight: bold; line-height: 1.5; }

.biggest.biggest { font-size: 1.6em; font-weight: bold; line-height: 1.5; }

.smaller { font-size: 0.9em; }

.small, small { font-size: 0.8em; }

@media (max-width: 528px) { .big.big { font-size: 1.1em; }
  .bigger.bigger { font-size: 1.2em; }
  .biggest.biggest { font-size: 1.3em; }
  .small, small { font-size: 0.9em; } }
/* color -----------
----------------------------- */
.black, .gray, .cha, .brown { color: #675042; font-weight: bold; }

.blue, .kon, .blue-koi, .green, .kimidori, .murasaki { color: #4b93b4; font-weight: bold; }

.red, .orange, .red_pink, .red-koi, .orange-koi { color: #ef7e17; font-weight: bold; }

.pink { color: #f5c598; font-weight: bold; }

.white { color: white; font-weight: bold; }

.yellow { color: #fff570; font-weight: bold; }

.mizu { color: #75bacc; font-weight: bold; }

/* pen -----------
----------------------------- */
.pen_green, .pen_mizu, .pen_blue, .pen-green, .pen-mizu, .pen-blue { font-weight: bold; background-image: repeating-linear-gradient(transparent, transparent 60%, #e8f4f9 60%, #bcebff); }

.pen_orenge, .pen_orange, .pen_pink, .pen_orenge-koi, .pen_orange-koi, .pen_red, .pen-orenge, .pen-orange, .pen-pink, .pen-orenge-koi, .pen-orange-koi, .pen-red, .penline_pink { font-weight: bold; background-image: repeating-linear-gradient(transparent, transparent 56%, #f5c598 88%, #f5c598); }

.pen_cream, .pen_yellow, .pen-cream, .pen-yellow, .pen { font-weight: bold; background: repeating-linear-gradient(#fff570, #fff570) 0 100%/0 10px no-repeat; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; }
.pen_cream.active, .pen_yellow.active, .pen-cream.active, .pen-yellow.active, .pen.active { background-size: 100% 10px; }

.penline-red, .penline { background: url(/image/common/line/penline.webp) repeat-x left bottom; font-weight: bold; }

.penline-blue { background: url(/image/common/line/penline_blue.webp) repeat-x left bottom; font-weight: bold; color: #4b93b4; }

/* weight -----------
----------------------------- */
em, i { font-style: normal; }

.bold, strong, b, em { font-weight: bold; }

.normal { font-weight: normal; }

/* decoration -----------
----------------------------- */
[class^="ruby-"], [class*=" ruby-"] { -webkit-text-emphasis: filled circle #f85523; text-emphasis: filled circle #f85523; font-weight: bold; }

.ruby-red { -webkit-text-emphasis: filled circle #f85523; text-emphasis: filled circle #f85523; }

.ruby-brown { -webkit-text-emphasis: filled circle #675042; text-emphasis: filled circle #675042; }

[class^="outline-"], [class*=" outline-"] { color: white; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 0.2em 0.4em; background-color: #675042; }

.outline-brown { background-color: #675042; }

.outline-green { background-color: #4b93b4; }

.outline-red { background-color: #ef7e17; }

.font-yoko, .youko { font-family: 'youko'; font-weight: normal; font-size: 1.5em; }

.text-sideline { text-align: center; font-size: 1.2em; color: #ef7e17; font-weight: bold; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: flex-end; align-items: flex-end; line-height: 1.4; }
@media (max-width: 528px) { .text-sideline { display: block; position: relative; z-index: 1; padding-bottom: 10px; text-align: left; } }
.text-sideline::before, .text-sideline::after { content: "|"; display: inline-block; font-size: 1.2em; color: #756154; }
.text-sideline::before { -moz-transform: rotate(-20deg); -ms-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); transform: rotate(-20deg); margin-right: 1em; }
@media (max-width: 528px) { .text-sideline::before { content: ""; margin-left: 0; -moz-transform: rotate(0); -ms-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); display: block; width: 100%; position: absolute; bottom: 0; left: 0; height: 10px; background-image: repeating-linear-gradient(transparent, transparent 10%, #fff570 70%, #fff570); z-index: 1; } }
.text-sideline::after { -moz-transform: rotate(20deg); -ms-transform: rotate(20deg); -webkit-transform: rotate(20deg); transform: rotate(20deg); margin-left: 1em; }
@media (max-width: 528px) { .text-sideline::after { content: none; } }

.wa { display: inline-block; background: url(/image/common/line/wa01.webp) no-repeat center center; background-size: contain; padding: 0.2em; font-weight: bold; }

.wa02 { display: inline-block; padding: 0.2em; font-weight: bold; background-image: url(/image/common/line/wa02-anim.svg); background-repeat: no-repeat; background-position: center; background-size: contain; }

.wa04 { display: inline-block; padding: 0.2em; font-weight: bold; background-image: url(/image/common/line/wa04-anim.svg); background-repeat: no-repeat; background-position: center; background-size: contain; }

hr { border: none; width: 94%; max-width: 1024px; margin: 24px auto; }
hr.dash-brown { background: url(/image/common/line/dash-brown.webp) repeat-x left center; min-height: 16px; }
hr.dash-red { background: url(/image/common/line/dash-red.webp) repeat-x left center; min-height: 16px; }
hr.cut { background: url(/image/common/line/cut.webp) no-repeat center top; min-height: 32px; margin-bottom: 0; }
hr.lineblank { margin: 1em; }

div.round { width: 94%; max-width: 1024px; margin: 24px auto; text-align: right; }
div.round a { display: inline-block; font-size: 16px; font-size: 1rem; line-height: 1.4; text-align: left; color: #756154; font-weight: bold; -moz-border-radius: 38px; -webkit-border-radius: 38px; border-radius: 38px; border: 1px solid #e3dfdc; padding: 16px 42px 16px 24px; margin: 8px 0; -moz-box-shadow: 0px 3px 0px #b2a7a0; -webkit-box-shadow: 0px 3px 0px #b2a7a0; box-shadow: 0px 3px 0px #b2a7a0; position: relative; background: white; }
div.round a::after { content: "\f105"; font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; top: calc(50% - 0.5em); right: 16px; color: #75bacc; }
div.round a:hover { background: #fcf6db; }

.tri { width: 94%; max-width: 1024px; margin: 24px auto; text-align: right; }
@media (max-width: 528px) { .tri { text-align: left; } }
.tri:before { content: "\f144"; font-family: icon; padding-right: 0.2em; line-height: 1; color: #4b93b4; }
.tri a { text-decoration: underline; }

.gradientbtn { width: 94%; max-width: 1024px; margin: 24px auto; text-align: center; }
.gradientbtn a { display: inline-block; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzRiOTNiNCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzMzNjQ3YSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #4b93b4), color-stop(100%, #33647a)); background: -moz-linear-gradient(#4b93b4, #33647a); background: -webkit-linear-gradient(#4b93b4, #33647a); background: linear-gradient(#4b93b4, #33647a); font-weight: bold; color: white; padding: 16px 32px; }
.gradientbtn a:hover { opacity: 0.8; }

[class^="btn-"] a, [class*=" btn-"] a { display: block; max-width: 540px; margin: 24px auto; text-align: center; font-weight: bold; color: white; padding: 16px 32px; -moz-border-radius: 64px; -webkit-border-radius: 64px; border-radius: 64px; position: relative; line-height: 1.4; font-size: 22px; font-size: 1.375rem; }
@media (max-width: 528px) { [class^="btn-"] a, [class*=" btn-"] a { width: 100%; text-align: left; font-size: 18px; font-size: 1.125rem; } }
[class^="btn-"] a::after, [class*=" btn-"] a::after { content: "\f105"; font-family: icon; padding-right: 0em; line-height: 1; position: absolute; right: 16px; top: calc(50% - 0.5em); }
[class^="btn-"] a:hover, [class*=" btn-"] a:hover { -moz-transform: translateY(3px); -ms-transform: translateY(3px); -webkit-transform: translateY(3px); transform: translateY(3px); -moz-box-shadow: 0px 0px 0px #675042; -webkit-box-shadow: 0px 0px 0px #675042; box-shadow: 0px 0px 0px #675042; }

.btn-blue a { background: #4b93b4; -moz-box-shadow: 0px 3px 0px #33647a; -webkit-box-shadow: 0px 3px 0px #33647a; box-shadow: 0px 3px 0px #33647a; }
.btn-blue a:hover { background: #75bacc; }

.btn-brown a { background: #756154; -moz-box-shadow: 0px 3px 0px #675042; -webkit-box-shadow: 0px 3px 0px #675042; box-shadow: 0px 3px 0px #675042; }
.btn-brown a:hover { background: #756154; }

.btn-yellow a { background: #fff570; border: 1px solid #ef7e17; color: #675042; -moz-box-shadow: 0px 3px 0px #ef7e17; -webkit-box-shadow: 0px 3px 0px #ef7e17; box-shadow: 0px 3px 0px #ef7e17; }
.btn-yellow a:hover { background: #fe9; }
.btn-yellow a::after { color: #ef7e17; }

.list-hana, .list-check, .list-star, .disc, .decimal { width: 94%; max-width: 1024px; margin: 24px auto; margin: 0 auto; max-width: 800px; line-height: 1.4; }
.list-hana li, .list-check li, .list-star li, .disc li, .decimal li { padding: 12px 0; margin-left: 48px; }
.list-hana p, .list-check p, .list-star p, .disc p, .decimal p { width: auto; padding: 0 0 16px; }
.list-hana p:last-child, .list-check p:last-child, .list-star p:last-child, .disc p:last-child, .decimal p:last-child { padding: 0; }
@media (max-width: 528px) { .list-hana, .list-check, .list-star, .disc, .decimal { margin: 24px 0; } }

.disc { list-style: disc; }

.decimal { list-style: decimal; }
.decimal li { padding-left: 8px; }

.list-hana li { background: url(/image/common/list/hana.webp) no-repeat left 0.5em; margin-left: 28px; padding-left: 32px; }

.list-check li { background: url(/image/common/list/check.webp) no-repeat 0.2em 0.8em; margin-left: 28px; padding-left: 32px; }

.list-star li { background: url(/image/common/list/star.webp) no-repeat left 16px; margin-left: 28px; padding-left: 32px; }

.flex { width: 94%; max-width: 1024px; margin: 24px auto; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
.flex > li, .flex > div { padding: 8px; margin-bottom: 32px; text-align: center; }
.flex p { flex: 1; width: auto; }
@media (max-width: 528px) { .flex { -webkit-flex-direction: column; flex-direction: column; }
  .flex > li, .flex > div { width: 100%; } }
.flex.flex.half > li, .flex.flex.half > div { width: 50%; }
@media (max-width: 528px) { .flex.flex.half > li, .flex.flex.half > div { width: 100%; } }

.square { margin: 24px 64px; margin-top: 32px; }
@media (max-width: 528px) { .square { margin: 24px 12px; } }
.square dt { font-weight: bold; text-indent: -1em; }
.square dt:before { content: "■"; color: #ef7e17; margin-right: 4px; }
.square dd { padding-bottom: 1.6em; }
.square dd:last-child { padding-bottom: 0; }
.square p { margin: 24px 0; padding-left: 1em; }
.square p:first-child { margin-top: 8px; }

.arrow-down { margin: 24px 64px; }
@media (max-width: 528px) { .arrow-down { margin: 24px 12px; } }
.arrow-down li { padding: 8px 12px; }
.arrow-down li:before { content: url(/image/common/arrow_d.gif); display: block; padding: 0 1.6em; }
.arrow-down li:first-child:before { content: none; }

.checkdl, .stardl { margin: 24px 64px; }
@media (max-width: 528px) { .checkdl, .stardl { margin: 24px 12px; } }
.checkdl dt, .stardl dt { font-weight: bold; padding-left: 1.4em; text-indent: -1.2em; }
.checkdl dt:before, .stardl dt:before { padding-right: 0.2em; }
.checkdl dd, .stardl dd { padding-bottom: 1.6em; }
.checkdl dd:last-child, .stardl dd:last-child { padding-bottom: 0; }
.checkdl p, .stardl p { margin: 24px 0; padding-left: 1em; }
.checkdl p:first-child, .stardl p:first-child { margin-top: 8px; }
.checkdl p:last-child, .stardl p:last-child { margin-bottom: 8px; }

.checkdl dt:before { content: url(/image/common/list/check.webp); }

.stardl dt:before { content: "\f005"; font-family: icon; padding-right: 0.2em; line-height: 1; color: #ef7e17; }

.list-faq, section.list-faq { line-height: 1.8; width: 94%; max-width: 1024px; margin: 24px auto; margin: 0 auto; }
.list-faq dt, .list-faq h2, .list-faq h3, section.list-faq dt, section.list-faq h2, section.list-faq h3 { background: #f4f2f1; font-weight: bold; line-height: 1.4; padding: 14px 8px 16px 64px; position: relative; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; overflow: hidden; }
@media (max-width: 528px) { .list-faq dt, .list-faq h2, .list-faq h3, section.list-faq dt, section.list-faq h2, section.list-faq h3 { padding: 8px 8px 8px 48px; } }
.list-faq dt::before, .list-faq h2::before, .list-faq h3::before, section.list-faq dt::before, section.list-faq h2::before, section.list-faq h3::before { content: url(/image/parts/faqbox/q.svg); display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; position: absolute; left: 0; top: 0; line-height: 1; height: 100%; background: #75bacc; color: white; padding: 0 0.6em; }
.list-faq dd, .list-faq > p, section.list-faq dd, section.list-faq > p { margin: 12px 16px 36px 32px; }
.list-faq dd:last-child, .list-faq > p:last-child, section.list-faq dd:last-child, section.list-faq > p:last-child { padding-bottom: 64px; }
@media (max-width: 528px) { .list-faq dd, .list-faq > p, section.list-faq dd, section.list-faq > p { margin: 12px 16px 24px 16px; } }

/* link-block
------------------------------------*/
.link-block { width: 94%; max-width: 1024px; margin: 24px auto; max-width: 928px; line-height: 1.4; text-align: center; }
.link-block li { width: calc(100% / 3); padding: 4px; }
@media (max-width: 528px) { .link-block li { width: 100%; padding: 0 0 8px; } }
.link-block a { font-weight: bold; display: block; background: white; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; border: 1px solid #e3dfdc; padding: 16px; padding-right: 24px; position: relative; color: #675042; text-align: left; font-size: 16px; font-size: 1rem; -moz-box-shadow: 0px 3px 0px rgba(103, 80, 66, 0.3); -webkit-box-shadow: 0px 3px 0px rgba(103, 80, 66, 0.3); box-shadow: 0px 3px 0px rgba(103, 80, 66, 0.3); }
.link-block a::after { content: "\f105"; font-family: icon; padding-right: 0.2em; line-height: 1; color: #ef7e17; position: absolute; top: calc(50% - 0.5em); right: 4px; font-size: 20px; font-size: 1.25rem; }
.link-block a:hover { -moz-transform: translateY(3px); -ms-transform: translateY(3px); -webkit-transform: translateY(3px); transform: translateY(3px); -moz-box-shadow: 0px 0px 0px #e3dfdc; -webkit-box-shadow: 0px 0px 0px #e3dfdc; box-shadow: 0px 0px 0px #e3dfdc; background: #fcf6db; color: #ef7e17; }
.link-block dt { display: inline-block; background: white; -moz-border-radius: 12px 12px 0 0; -webkit-border-radius: 12px; border-radius: 12px 12px 0 0; font-weight: bold; text-align: center; padding: 16px 24px 12px; border: 2px dashed #b2a7a0; border-bottom: none; position: relative; top: 3px; z-index: 5; font-size: 20px; font-size: 1.25rem; }
.link-block dt small { display: block; font-size: 16px; font-size: 1rem; }
@media (max-width: 528px) { .link-block dt { font-size: 15px; font-size: 0.9375rem; } }

ul.link-block, .link-block ul { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; background: #f4f2f1; border: 2px dashed #b2a7a0; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; -moz-box-shadow: 8px 8px 0 white inset, 8px -8px 0 white inset, -8px 8px 0 white inset, -8px -8px 0 white inset; -webkit-box-shadow: 8px 8px 0 white inset, 8px -8px 0 white inset, -8px 8px 0 white inset, -8px -8px 0 white inset; box-shadow: 8px 8px 0 white inset, 8px -8px 0 white inset, -8px 8px 0 white inset, -8px -8px 0 white inset; padding: 12px 12px 16px 12px; }
@media (max-width: 1024px) { ul.link-block, .link-block ul { font-size: 15px; font-size: 0.9375rem; letter-spacing: 0; } }

/* block
------------------------------------*/
.block01.block01 > li, .block01.block01 > div, .block01.block01 dd li { width: 100%; }

.block02.block02 > li, .block02.block02 > div, .block02.block02 dd li { width: 50%; }

.block03.block03 > li, .block03.block03 > div, .block03.block03 dd li { width: calc(100% / 3); }

.block04.block04 > li, .block04.block04 > div, .block04.block04 dd li { width: 25%; }

@media (max-width: 528px) { .block02.block02 > li, .block02.block02 > div, .block02.block02 dd li, .block03.block03 > li, .block03.block03 > div, .block03.block03 dd li, .block04.block04 > li, .block04.block04 > div, .block04.block04 dd li { width: 100%; } }

/* block
------------------------------------*/
.block01.block01 > li, .block01.block01 > div, .block01.block01 dd li { width: 100%; }

.block02.block02 > li, .block02.block02 > div, .block02.block02 dd li { width: 50%; }

.block03.block03 > li, .block03.block03 > div, .block03.block03 dd li { width: calc(100% / 3); }

.block04.block04 > li, .block04.block04 > div, .block04.block04 dd li { width: 25%; }

@media (max-width: 528px) { .block02.block02 > li, .block02.block02 > div, .block02.block02 dd li, .block03.block03 > li, .block03.block03 > div, .block03.block03 dd li, .block04.block04 > li, .block04.block04 > div, .block04.block04 dd li { width: 100%; } }

.list_card { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; width: 94%; max-width: 1024px; margin: 24px auto; max-width: 928px; line-height: 1.4; }
.list_card li { width: calc(100% / 3 - 8px); margin-bottom: 32px; }
.list_card a { display: block; height: 100%; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; background: white; -moz-box-shadow: 0px 0px 3px rgba(103, 80, 66, 0.3); -webkit-box-shadow: 0px 0px 3px rgba(103, 80, 66, 0.3); box-shadow: 0px 0px 3px rgba(103, 80, 66, 0.3); padding: 8px; color: #675042; padding-bottom: 80px; position: relative; }
.list_card a::before { content: ""; width: 30%; height: 16px; background: rgba(75, 147, 180, 0.3); position: absolute; top: -8px; left: 35%; -moz-transform: rotate(-3deg); -ms-transform: rotate(-3deg); -webkit-transform: rotate(-3deg); transform: rotate(-3deg); }
.list_card a:hover { color: #ef7e17; background: #fcf6db; }
.list_card img { width: 100%; height: 180px; object-fit: cover; object-position: center; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; border: 1px solid rgba(103, 80, 66, 0.3); }
.list_card p { font-size: 16px; font-size: 1rem; margin: 8px 0 0; }
.list_card .more { background: #756154; color: white; position: absolute; left: 8px; bottom: 8px; width: calc(100% - 16px); font-size: 14px; font-size: 0.875rem; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; padding: 8px; }
.list_card .more::after { font-family: icon; padding-right: 0.2em; line-height: 1; content: "\f105"; position: absolute; right: 4px; top: calc(50% - 0.5em); }

.dl-title { width: 94%; max-width: 1024px; margin: 24px auto; }
.dl-title > dt { background: #4b93b4; color: white; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 0.6em 1.2em; font-weight: bold; margin-bottom: 4px; line-height: 1.4; }
.dl-title > dd { margin: 24px 32px; padding-bottom: 2.4em; }
@media (max-width: 528px) { .dl-title > dd { margin: 24px 12px; } }
@media (max-width: 528px) { .dl-title > dd { margin: 24px; } }
@media (max-width: 528px) and (max-width: 528px) { .dl-title > dd { margin: 24px 12px; } }

.dl-title p, .dl-title .img-right, .dl-title .img-left { margin: 24px 0; }

.list-arrow { width: 94%; max-width: 1024px; margin: 24px auto; max-width: 800px; }
.list-arrow li:before { content: url(/image/common/arrow_d.gif); display: block; padding-left: 24px; }
.list-arrow li:first-child:before { content: none; }

.round-table, .table-round { width: 94%; max-width: 1024px; margin: 24px auto; max-width: 640px; border-collapse: separate; border-spacing: 2px 6px; }
@media (max-width: 528px) { .round-table, .table-round { border-spacing: 0 12px; } }
.round-table th, .round-table td, .table-round th, .table-round td { padding: 0.4em 0.8em; vertical-align: middle; }
@media (max-width: 528px) { .round-table th, .round-table td, .table-round th, .table-round td { display: block; } }
.round-table th, .table-round th { color: white; background: #756154; -moz-border-radius: 6px 0 0 6px; -webkit-border-radius: 6px; border-radius: 6px 0 0 6px; width: 30%; }
@media (max-width: 528px) { .round-table th, .table-round th { -moz-border-radius: 6px 6px 0 0; -webkit-border-radius: 6px; border-radius: 6px 6px 0 0; width: 100%; } }
.round-table td, .table-round td { background: #f4f2f1; -moz-border-radius: 0 6px 6px 0; -webkit-border-radius: 0; border-radius: 0 6px 6px 0; }
.round-table td i, .table-round td i { display: inline-block; width: 50%; text-align: center; }
@media (max-width: 528px) { .round-table td i, .table-round td i { display: block; width: 100%; } }
@media (max-width: 528px) { .round-table td, .table-round td { text-align: center; -moz-border-radius: 0 0 6px 6px; -webkit-border-radius: 0; border-radius: 0 0 6px 6px; } }
.round-table caption, .table-round caption { caption-side: bottom; text-align: right; font-size: 0.8em; }

.maintable { width: 94%; max-width: 1024px; margin: 24px auto; border-collapse: separate; border-spacing: 4px; }
.maintable caption { background: #4b93b4; text-align: center; color: white; font-weight: bold; padding: 0.6em; }
.maintable th, .maintable td { border-right: 1px solid rgba(103, 80, 66, 0.3); border-bottom: 1px solid rgba(103, 80, 66, 0.3); text-align: left; padding: 0.6em; line-height: 1.6; }
.maintable th { width: 28%; background: rgba(245, 197, 152, 0.1); }
.maintable thead th { background: none; text-align: center; width: auto; }
@media (max-width: 528px) { .maintable thead { display: none; } }
@media (max-width: 528px) { .maintable { border-spacing: 8px; }
  .maintable th, .maintable td { display: block; border-left: 1px solid rgba(103, 80, 66, 0.3); }
  .maintable th { width: 100%; border-top: 1px solid rgba(103, 80, 66, 0.3); } }
.maintable.half th { width: 50%; }
@media (max-width: 528px) { .maintable.half th { width: 100%; } }

.recaptcha_policy { text-align: center; font-size: 11px; font-size: 0.6875rem; color: #b2a7a0; }
@media (max-width: 528px) { .recaptcha_policy { margin-top: 0; } }

.recaptcha_policy a { color: #75bacc; text-decoration: underline; }

.grecaptcha-badge { visibility: hidden; }

.movie { width: 94%; max-width: 1024px; margin: 24px auto; }
.movie iframe { aspect-ratio: 16 / 9; width: 100%; height: auto; }

.link_campaign { width: 94%; max-width: 1024px; margin: 24px auto; text-align: center; }
.link_campaign a { display: inline-block; margin: 16px auto; }
.link_campaign img { margin-top: 8px; filter: drop-shadow(1px 1px 1px rgba(103, 80, 66, 0.3)); }

.gradedate { text-align: center; padding: 8px; }

.pageindex { position: relative; border: dotted 3px #b2a7a0; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; background: white; margin: 24px; }
@media (max-width: 528px) { .pageindex { margin: 24px 12px; } }
.pageindex p { margin: 0; }
.pageindex .title { display: inline-block; padding: 8px 64px 8px 32px; position: relative; font-size: 14px; font-size: 0.875rem; top: 8px; left: -20px; color: white; background: #b2a7a0; }
@media (max-width: 528px) { .pageindex .title { display: block; } }
.pageindex .title:before { position: absolute; content: ''; top: 100%; left: 0; border-bottom: solid 15px transparent; border-right: solid 20px #675042; }
.pageindex ul { margin: 24px 32px; margin-top: 16px; }
@media (max-width: 528px) { .pageindex ul { margin: 24px 12px; } }
.pageindex li { margin: 0 auto; padding: 8px 0 0 12px; border-bottom: dotted 1px #b2a7a0; }
.pageindex a { display: block; font-size: 16px; font-size: 1rem; padding: 4px 0; color: #675042; line-height: 1.4; }
@media (max-width: 528px) { .pageindex a { text-indent: -1.2em; padding: 12px 0 12px 0.6em; } }
.pageindex a::before { content: "\f13a"; font-family: icon; padding-right: 0.2em; line-height: 1; }
.pageindex a:hover { color: #ef7e17; }

.wp-pagenavi { line-height: 1; text-align: center; padding: 16px 0; width: 100%; }
.wp-pagenavi .current { display: inline-block; font-weight: bold; padding: 0.6em; color: #85b6cc; }
.wp-pagenavi .page-of { display: none; }
.wp-pagenavi a { display: inline-block; border: 2px solid #a1c7d8; padding: 0.6em; margin: 0 2px; text-decoration: none; color: #85b6cc; font-weight: bold; }
.wp-pagenavi a:hover { background: #e2eef3; border-color: #bed8e4; }

/* add_icon
------------------------------------ */
.question { position: relative; margin-top: 64px; }
.question::before { content: url(/image/common/img03.svg); position: absolute; top: -16px; left: -8px; width: 40px; }
@media (max-width: 528px) { .question::before { left: 0px; width: 32px; } }

.price { position: relative; margin-top: 64px; }
.price::before { content: url(/image/content/page/price/img02.webp); position: absolute; top: -32px; left: -8px; }
@media (max-width: 528px) { .price::before { left: 0px; } }

.twobtns { width: 94%; max-width: 1024px; margin: 24px auto; margin: 64px auto 0; max-width: 580px; text-align: center; padding-bottom: 32px; }
.twobtns a { display: block; -moz-border-radius: 64px; -webkit-border-radius: 64px; border-radius: 64px; font-weight: bold; margin-bottom: 16px; line-height: 1.4; padding: 16px 8px; }
@media (max-width: 528px) { .twobtns a { -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; } }
.twobtns a.detail { background: #ef7e17; color: white; font-size: 28px; font-size: 1.75rem; -moz-box-shadow: 0px 3px 0px #a9570c; -webkit-box-shadow: 0px 3px 0px #a9570c; box-shadow: 0px 3px 0px #a9570c; }
.twobtns a.detail:hover { background: #f2933d; -moz-transform: translateY(3px); -ms-transform: translateY(3px); -webkit-transform: translateY(3px); transform: translateY(3px); -moz-box-shadow: 0px 0px 0px #ef7e17; -webkit-box-shadow: 0px 0px 0px #ef7e17; box-shadow: 0px 0px 0px #ef7e17; }
@media (max-width: 528px) { .twobtns a.detail { font-size: calc(100vw / 22); padding: 18px 6px; } }
.twobtns a.toform { border: 2px solid #ef7e17; background: white; color: #ef7e17; padding: 8px; margin: 0 auto 16px; font-size: 25px; font-size: 1.5625rem; }
.twobtns a.toform:hover { background: #fcf6db; }
@media (max-width: 528px) { .twobtns a.toform { font-size: calc(100vw / 24); padding: 0.4em 0.2em; width: 100%; padding: 12px 6px; } }
.twobtns small { display: block; font-size: 16px; font-size: 1rem; }

.btn-child { font-size: 18px; font-size: 1.125rem; }
@media (max-width: 528px) { .btn-child { font-size: 16px; font-size: 1rem; } }

.btn-tel { max-width: 360px; width: 100%; text-align: center; }
.btn-tel a { display: inline-block; background: #4b93b4; color: white; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; line-height: 1.2; padding: 8px 16px 8px 64px; position: relative; }
@media (max-width: 528px) { .btn-tel a { padding: 8px 16px 8px 48px; } }
.btn-tel a::before { content: "\e958"; font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; top: calc(50% - 0.5em); left: 8px; font-size: 52px; font-size: 3.25rem; }
@media (max-width: 528px) { .btn-tel a::before { font-size: 36px; font-size: 2.25rem; } }
.btn-tel a::after { content: none; }
.btn-tel i, .btn-tel small { font-size: 14px; font-size: 0.875rem; }
.btn-tel em { font-size: 36px; font-size: 2.25rem; }
@media (max-width: 528px) { .btn-tel em { font-size: 24px; font-size: 1.5rem; } }

.sitenav { background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjEuMCIgeTE9IjEuMCIgeDI9IjAuMCIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIyNSUiIHN0b3AtY29sb3I9IiNmZmZmZmYiLz48c3RvcCBvZmZzZXQ9IjI1JSIgc3RvcC1jb2xvcj0iIzRiOTNiNCIgc3RvcC1vcGFjaXR5PSIwLjE2Ii8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiM0YjkzYjQiIHN0b3Atb3BhY2l0eT0iMC4xNiIvPjxzdG9wIG9mZnNldD0iNTAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIi8+PHN0b3Agb2Zmc2V0PSI3NSUiIHN0b3AtY29sb3I9IiNmZmZmZmYiLz48c3RvcCBvZmZzZXQ9Ijc1JSIgc3RvcC1jb2xvcj0iIzRiOTNiNCIgc3RvcC1vcGFjaXR5PSIwLjE2Ii8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjNGI5M2I0IiBzdG9wLW9wYWNpdHk9IjAuMTYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA='); background: -moz-linear-gradient(135deg, #ffffff 25%, rgba(75, 147, 180, 0.16) 25%, rgba(75, 147, 180, 0.16) 50%, #ffffff 50%, #ffffff 75%, rgba(75, 147, 180, 0.16) 75%, rgba(75, 147, 180, 0.16)); background: -webkit-linear-gradient(135deg, #ffffff 25%, rgba(75, 147, 180, 0.16) 25%, rgba(75, 147, 180, 0.16) 50%, #ffffff 50%, #ffffff 75%, rgba(75, 147, 180, 0.16) 75%, rgba(75, 147, 180, 0.16)); background: linear-gradient(-45deg, #ffffff 25%, rgba(75, 147, 180, 0.16) 25%, rgba(75, 147, 180, 0.16) 50%, #ffffff 50%, #ffffff 75%, rgba(75, 147, 180, 0.16) 75%, rgba(75, 147, 180, 0.16)); background-size: 10px 10px; text-align: center; margin: 24px auto; padding: 16px; }
.sitenav .title { display: inline-block; background: white; padding: 0.2em 0.8em; font-weight: bold; margin-bottom: 0.8em; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
.sitenav ul { margin: 24px 64px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; margin-top: 0; margin-bottom: 0; }
@media (max-width: 528px) { .sitenav ul { margin: 24px 12px; } }
@media (max-width: 528px) { .sitenav ul { -webkit-flex-direction: column; flex-direction: column; } }
.sitenav li { width: calc(100% / 3); padding: 8px; }
@media (max-width: 528px) { .sitenav li { width: 94%; max-width: 1024px; margin: 24px auto; margin: 8px auto 0; } }
.sitenav li.here a { background-color: #f96c7B; }
.sitenav a { display: block; background: #48a4bb; -moz-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3); padding: 0.6em; font-weight: bold; text-align: center; color: white; text-decoration: none; line-height: 1.3; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
.sitenav a:before { content: "\f144"; font-family: "icon"; margin-right: 0.3em; }
.sitenav a:hover { background-color: #75bacc; }

.btn { margin: 16px 0; }
.btn a { display: block; color: white; background: #ef7e17; position: relative; -moz-border-radius: 100px; -webkit-border-radius: 100px; border-radius: 100px; padding: 16px 16px 16px 64px; width: 100%; font-size: 30px; font-size: 1.875rem; font-weight: bold; line-height: 1.2; }
.btn a::before { content: "\e958"; font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; top: calc(50% - 0.5em); left: 28px; font-size: 42px; font-size: 2.625rem; left: 16px; font-weight: normal; }
.btn i { font-size: 0.9em; }
.btn small { display: block; font-size: 14px; font-size: 0.875rem; font-weight: normal; }

.response-2way { background: white; padding: 32px 8px; }
@media (max-width: 528px) { .response-2way { padding: 32px 0; } }
.response-2way .title { font-size: 25px; font-size: 1.5625rem; font-weight: bold; text-align: center; line-height: 1.4; }
@media (max-width: 528px) { .response-2way .title { text-align: left; font-size: 1.2em; } }

.way-list { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; max-width: 1024px; margin: 24px auto; }
@media (max-width: 528px) { .way-list { -webkit-flex-direction: column; flex-direction: column; } }
.way-list div { width: 48%; }
@media (max-width: 528px) { .way-list div { width: 100%; }
  .way-list div:last-child dd { margin-bottom: 0; padding-bottom: 0; } }
.way-list dt { color: #ef7e17; border-left: 8px solid #ef7e17; font-weight: bold; padding-left: 0.8em; font-size: 22px; font-size: 1.375rem; }
@media (max-width: 528px) { .way-list dt { font-size: 18px; font-size: 1.125rem; padding-left: 0.4em; margin: 0 16px; } }
.way-list dd { padding-bottom: 16px; margin: 24px; margin-top: 16px; }
@media (max-width: 528px) { .way-list dd { margin: 24px 12px; } }
.way-list dd p { width: auto; margin: 0; font-size: 0.9em; }

.response-device { background: #fcf6db; padding: 32px 8px 64px; }
.response-device dl { max-width: 1024px; margin: 24px auto; }
.response-device dl > div { padding-top: 8%; margin-top: 80px; position: relative; }
@media (max-width: 528px) { .response-device dl > div { padding-top: 20%; } }
.response-device dl .tel { background: url(/image/parts/response/tel_head.webp) no-repeat center top/contain, url(/image/parts/response/tel_foot.webp) no-repeat center bottom/contain, url(/image/parts/response/tel_bg.webp) repeat-y center/contain; }
@media (max-width: 528px) { .response-device dl .tel { background: url(/image/parts/response/sp/tel_head.webp) no-repeat center top/contain, url(/image/parts/response/sp/tel_foot.webp) no-repeat center bottom/contain, url(/image/parts/response/sp/tel_bg.webp) repeat-y center/contain; } }
.response-device dl .tel dd { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; }
@media (max-width: 768px) { .response-device dl .tel dd { -webkit-flex-direction: column; flex-direction: column; } }
.response-device dl .tel dd > div { padding: 0 8px; flex: 1; }
.response-device dl .tel dd > img { max-width: 32%; }
@media (max-width: 768px) { .response-device dl .tel dd > img { max-width: 94%; } }
.response-device dl .tel dd span { background: #675042; color: white; margin-right: 0.3em; }
.response-device dl .tel .telimg { margin: 16px 0 8px; }
.response-device dl .web { background: url(/image/parts/response/form_head.webp) no-repeat center top/contain, url(/image/parts/response/form_foot.webp) no-repeat center bottom/contain, url(/image/parts/response/form_bg.webp) repeat-y center/contain; }
@media (max-width: 528px) { .response-device dl .web { background: url(/image/parts/response/sp/form_head.webp) no-repeat center top/contain, url(/image/parts/response/sp/form_foot.webp) no-repeat center bottom/contain, url(/image/parts/response/sp/form_bg.webp) repeat-y center/contain; } }
.response-device dl .web ul { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
@media (max-width: 768px) { .response-device dl .web ul { display: block; } }
.response-device dl .web li { flex: 1; }
@media (max-width: 528px) { .response-device dl .web li { padding: 8px 0; }
  .response-device dl .web li a::before { display: block; position: static; } }
.response-device dl .web li.form a { background: #4b93b4; }
.response-device dl .web li.form a::before { content: "\f003"; }
.response-device dl .web li.line a { background: #3cb900; }
.response-device dl .web li.line a::before { content: "\e900"; }
.response-device dl .web p { text-align: center; font-weight: bold; }
.response-device dl.present { background: white; border: 6px dashed #e3dfdc; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; margin-top: 64px; position: relative; }
.response-device dl.present::before { content: url(/image/parts/response/present_img01.webp); position: absolute; top: -40px; left: 0; }
@media (max-width: 528px) { .response-device dl.present::before { content: none; } }
.response-device dl.present dt { text-align: center; }
@media (max-width: 528px) { .response-device dl.present dt { padding: 8px; } }
.response-device dl.present ul { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; }
@media (max-width: 1024px) { .response-device dl.present ul { -webkit-flex-direction: column; flex-direction: column; } }
.response-device dl.present li { padding: 4px; text-align: center; }
.response-device .action dt { position: absolute; bottom: calc(100% - 16px); left: 0; width: 100%; }
.response-device .action dt img { max-width: 54%; }
@media (max-width: 528px) { .response-device .action dt { bottom: calc(100% - 8px); } }
.response-device p { margin: 0 16px; line-height: 1.6; }
@media (max-width: 528px) { .response-device p { margin: 0; } }
.response-device dd { padding: 32px; }
@media (max-width: 1024px) { .response-device dd { padding: 32px 16px; } }

.response-contact { padding: 96px 8px 64px; }
.response-contact dl { max-width: 1024px; margin: 24px auto; }
.response-contact dl > div { position: relative; padding-top: 8%; background: url(/image/parts/response/contact_head.webp) no-repeat center top/contain, url(/image/parts/response/contact_foot.webp) no-repeat center bottom/contain, url(/image/parts/response/contact_bg.webp) repeat-y center/contain; }
@media (max-width: 528px) { .response-contact dl > div { background: url(/image/parts/response/sp/contact_head.webp) no-repeat center top/contain, url(/image/parts/response/sp/contact_foot.webp) no-repeat center bottom/contain, url(/image/parts/response/sp/contact_bg.webp) repeat-y center/contain; padding-top: 28%; } }
.response-contact dt { position: absolute; bottom: calc(100% - 16px); left: 0; }
.response-contact dd { padding: 16px 16px 32px; }
.response-contact a { background: #756154; }
.response-contact a::before { content: "\f087"; }

.response-leader { background: white; padding: 64px 16px; text-align: center; }

.response-device .btnlink a, .response-contact .btnlink a { display: block; color: white; text-align: center; padding: 0.8em; line-height: 1.4; -moz-border-radius: 32px; -webkit-border-radius: 32px; border-radius: 32px; width: 94%; max-width: 1024px; margin: 24px auto; margin: 0 auto; max-width: 640px; position: relative; }
.response-device .btnlink a::before, .response-contact .btnlink a::before { font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; top: calc(50% - 0.5em); left: 6%; font-size: 26px; font-size: 1.625rem; }
.response-device .btnlink a:hover, .response-contact .btnlink a:hover { opacity: 0.9; }

#usp { background: url(/image/content/index/usp/bg.webp) no-repeat center bottom/cover, url(/image/content/index/usp/bg02.webp); margin-bottom: 16px; position: relative; }
@media (max-width: 528px) { #usp { background: url(/image/content/index/usp/sp/bg.webp) no-repeat center bottom/cover, url(/image/content/index/usp/bg02.webp); } }
#usp .est { position: absolute; width: 100%; text-align: center; bottom: 100%; }
#usp .info { position: relative; margin-bottom: -64px; text-align: center; }
@media (max-width: 528px) { #usp .info { top: 0; margin-bottom: 0; } }
#usp .info img { filter: drop-shadow(2px 2px 2px rgba(103, 80, 66, 0.6)); }
#usp .inner { position: relative; top: 32px; }
@media (max-width: 528px) { #usp .inner { top: 0; } }

.box01 { background: url(/image/content/index/usp/bg02.webp); position: relative; top: -16px; padding-bottom: 32px; margin-bottom: -16px; }
.box01 .btns { text-align: center; margin: 16px 16px 64px; }
.box01 .btns li { display: inline-block; padding: 4px; }

.trial_btn { text-align: center; }
.trial_btn a { display: inline-block; position: relative; z-index: 3; }
.trial_btn a img { position: relative; z-index: 3; }

.usp-up { z-index: 3; margin-top: 8px; }
.usp-up ul { opacity: 0; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.usp-up ul img { display: none; }
.usp-up ul li:first-child img { display: block; }
.usp-up ul li { padding: 8px 4px 0; }
.usp-up ul.slick-initialized { opacity: 1; }
.usp-up ul.slick-initialized img { display: block; }

.top-info { background: #fcf6db; margin: 24px 64px; max-width: 928px; margin: 24px auto; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; border: 3px dashed #b2a7a0; padding: 0 16px 16px; }
@media (max-width: 528px) { .top-info { margin: 24px 12px; } }
.top-info p { margin: 0; padding: 16px 16px 0; font-size: 16px; font-size: 1rem; }
.top-info p.title { font-weight: bold; font-size: 18px; font-size: 1.125rem; }

.teacher_list { margin: 24px 64px; background: #fcf6db; padding: 16px; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
@media (max-width: 528px) { .teacher_list { margin: 24px 12px; } }
@media (max-width: 528px) { .teacher_list { display: block; margin: 24px 0; -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; } }
.teacher_list .prof { padding: 0 8px; margin-right: 8px; width: 32%; }
@media (max-width: 528px) { .teacher_list .prof { width: 100%; } }
.teacher_list .prof .photo { width: 172px; margin: 0 auto; background: url(/image/content/search/bg02.svg) no-repeat left bottom, url(/image/content/search/bg02.svg) no-repeat right top, url(/image/content/search/bg01.svg) no-repeat center/contain; padding: 8px 8px 24px 24px; }
.teacher_list .prof .photo img { width: 140px; height: 140px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; }
.teacher_list .prof ul { margin-left: 16px; }
@media (max-width: 528px) { .teacher_list .prof ul { margin: 0 16px; } }
.teacher_list .prof li { font-size: 15px; font-size: 0.9375rem; line-height: 1.4; margin: 8px 0; }
.teacher_list .prof li.name { font-size: 18px; font-size: 1.125rem; font-weight: bold; margin: 16px 0; }
.teacher_list .prof li i, .teacher_list .prof li span { display: inline-block; }
.teacher_list .introduce { flex: 1; background: white; margin-top: 32px; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
@media (max-width: 528px) { .teacher_list .introduce { margin-top: 16px; } }
.teacher_list .introduce dt { display: inline-block; background: #fff570; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; position: relative; top: -32px; left: -8px; font-weight: bold; padding: 0.4em 0.8em; margin-bottom: -16px; }
.teacher_list .introduce dt::before { content: ""; border: 8px solid transparent; border-top-color: #fff570; position: absolute; top: 100%; left: 32px; }
@media (max-width: 528px) { .teacher_list .introduce dt { display: block; top: 0; left: 0; margin-bottom: 0; padding: 1.2em 0.8em; cursor: pointer; }
  .teacher_list .introduce dt::after { content: "\f13a"; font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; right: 3%; top: calc(50% - 0.5em); -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; padding: 0; transform-origin: center center; }
  .teacher_list .introduce dt.open::after { -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -webkit-transform: rotate(-180deg); transform: rotate(-180deg); } }
.teacher_list .introduce dd { padding: 0 1em 1em; font-size: 16px; font-size: 1rem; }
@media (max-width: 528px) { .teacher_list .introduce dd { padding: 1em 1.6em; display: none; } }
@media (max-width: 528px) { .teacher_list .introduce.single dt::after { content: none; } }
@media (max-width: 528px) { .teacher_list .introduce.single dd { display: block; } }

.more_teacher { margin: 24px 64px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
@media (max-width: 528px) { .more_teacher { margin: 24px 12px; } }
@media (max-width: 528px) { .more_teacher { display: block; } }
.more_teacher li { width: calc(50% - 16px); padding: 8px 0; }
@media (max-width: 528px) { .more_teacher li { width: 100%; } }
.more_teacher a { display: block; line-height: 1.4; padding: 16px; background: #fff570; -moz-box-shadow: 0px 3px 0px rgba(103, 80, 66, 0.6); -webkit-box-shadow: 0px 3px 0px rgba(103, 80, 66, 0.6); box-shadow: 0px 3px 0px rgba(103, 80, 66, 0.6); -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; color: #675042; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; }
.more_teacher a:hover { background: #fffbc2; -moz-transform: translateY(2px); -ms-transform: translateY(2px); -webkit-transform: translateY(2px); transform: translateY(2px); -moz-box-shadow: 0px 1px 0px rgba(103, 80, 66, 0.8); -webkit-box-shadow: 0px 1px 0px rgba(103, 80, 66, 0.8); box-shadow: 0px 1px 0px rgba(103, 80, 66, 0.8); }
.more_teacher a:hover span { color: #ef7e17; }
.more_teacher .photo { padding-right: 16px; }
.more_teacher .photo img { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; width: 100px; height: 100px; }
.more_teacher p { flex: 1; margin: 0; position: relative; padding-bottom: 16px; }
.more_teacher em, .more_teacher i { display: block; padding: 4px 8px; }
.more_teacher em { border-bottom: 3px dotted white; }
.more_teacher i { font-size: 0.9em; }
.more_teacher small { display: inline-block; padding-left: 4px; }
.more_teacher span { display: inline-block; position: absolute; bottom: -8px; right: 0; background: white; font-weight: normal; font-size: 15px; font-size: 0.9375rem; -moz-border-radius: 2em; -webkit-border-radius: 2em; border-radius: 2em; padding: 2px 8px; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.more_teacher span::after { content: "\f054"; line-height: 1; font-family: icon; padding-right: 0.2em; line-height: 1; position: relative; top: 1px; left: 4px; }
@media (max-width: 528px) { .more_teacher.search { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
  .more_teacher.search li { width: 46%; }
  .more_teacher.search a { display: block; padding: 4px; }
  .more_teacher.search .photo { padding-right: 0; text-align: center; } }

#teacher_energy .push { font-weight: bold; color: #4b93b4; font-size: 1.1em; }

.list-energy { margin: 24px 64px; padding: 8px 16px 16px; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; background: #fee7d1; }
@media (max-width: 528px) { .list-energy { margin: 24px 12px; } }
.list-energy .headline { font-weight: bold; font-size: 1.1em; padding: 0.6em 1.2em 0.3em; margin: 0; border-bottom: 2px dotted #baa193; }
.list-energy table { width: 94%; max-width: 1024px; margin: 24px auto; margin-bottom: 0; font-size: 16px; font-size: 1rem; border-collapse: separate; border-spacing: 2px; }
.list-energy th { width: 8em; background: rgba(239, 126, 23, 0.2); }
.list-energy td { background: rgba(255, 255, 255, 0.6); }
.list-energy th, .list-energy td { padding: 4px 8px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
@media (max-width: 528px) { .list-energy th, .list-energy td { display: block; width: 100%; text-align: left; } }
.list-energy p { padding: 0.6em 1.6em; margin: 0; }

.voice-interview { width: 94%; max-width: 1024px; margin: 24px auto; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
.voice-interview li { width: 49%; margin-bottom: 16px; }
@media (max-width: 528px) { .voice-interview li { width: 100%; } }
.voice-interview a { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: flex-start; align-items: flex-start; height: 100%; background: #fff3bc; padding: 8px; -moz-box-shadow: 0px 0px 3px rgba(103, 80, 66, 0.3); -webkit-box-shadow: 0px 0px 3px rgba(103, 80, 66, 0.3); box-shadow: 0px 0px 3px rgba(103, 80, 66, 0.3); -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; line-height: 1.4; }
.voice-interview a p { margin: 0; font-size: 16px; font-size: 1rem; color: #675042; font-weight: bold; }
.voice-interview a span { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; display: inline-block; background: #fff570; padding: 0.3em 0.6em; font-size: 14px; font-size: 0.875rem; margin-bottom: 0.6em; font-weight: normal; }
.voice-interview a:hover { background: #fff570; }
.voice-interview img { border-radius: 12px; width: 30%; }
.voice-interview p { flex: 1; padding-left: 8px; }
.voice-interview.online a { display: block; }
.voice-interview.online img { width: 100%; margin-top: 16px; }

.voice-evidence { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: flex-start; align-items: flex-start; margin: 24px; }
@media (max-width: 528px) { .voice-evidence { margin: 24px 12px; } }
@media (max-width: 528px) { .voice-evidence { display: block; } }
.voice-evidence li { width: 49%; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; border: 2px solid transparent; margin-top: 16px; }
.voice-evidence li.type01 { border-color: #ef7e17; background: rgba(239, 126, 23, 0.4); }
.voice-evidence li.type01 .type { background: #ef7e17; }
.voice-evidence li.type02 { border-color: #4b93b4; background: rgba(75, 147, 180, 0.4); }
.voice-evidence li.type02 .type { background: #4b93b4; }
.voice-evidence li.type03 { border-color: #fff570; background: rgba(255, 245, 112, 0.4); }
.voice-evidence li.type03 .type { background: #fff570; }
.voice-evidence li.type04 { border-color: #f85523; background: rgba(248, 85, 35, 0.4); }
.voice-evidence li.type04 .type { background: #f85523; }
@media (max-width: 528px) { .voice-evidence li { width: 100%; } }
.voice-evidence p { margin: 0; }
.voice-evidence .start { padding: 8px; }
.voice-evidence .intro, .voice-evidence .comment { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; padding: 0 8px; }
.voice-evidence .intro p, .voice-evidence .comment p { flex: 1; line-height: 1.4; font-size: 0.9em; }
.voice-evidence .intro img { margin-right: 8px; }
.voice-evidence .content { background: rgba(255, 255, 255, 0.5); margin-top: 40px; }
.voice-evidence .content .center { position: relative; top: -48px; margin-bottom: -48px; }
.voice-evidence .title, .voice-evidence .name { padding: 0 0.8em; font-weight: bold; }
.voice-evidence .title { font-size: 1.2em; line-height: 1.4; }
.voice-evidence .name { margin-top: 16px; text-align: right; }
.voice-evidence .txt { text-align: center; background: white; padding: 0.8em; }
.voice-evidence .txt p { text-align: left; line-height: 30px; margin-top: 24px; background: url(/image/common/line/note.webp); }

.bigup dd { margin: 24px 64px; }
@media (max-width: 528px) { .bigup dd { margin: 24px 12px; } }
.bigup .graph { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; -webkit-align-items: flex-start; align-items: flex-start; }
.bigup .img-graph { width: 32%; position: relative; left: -8px; }
@media (max-width: 768px) { .bigup .img-graph { width: 64%; left: 0; } }
.bigup .upnum { background: url(/image/content/voice/up/parts/uplist/bg01.webp) no-repeat center/contain; max-width: 140px; min-height: 140px; width: 26%; -moz-transform: rotate(-6deg); -ms-transform: rotate(-6deg); -webkit-transform: rotate(-6deg); transform: rotate(-6deg); text-align: center; line-height: 1.2; margin: 0; font-weight: bold; text-shadow: 2px 2px 0 white, -2px 2px 0 white, 2px -2px 0 white, -2px -2px 0 white; }
@media (max-width: 768px) { .bigup .upnum { -moz-transform: rotate(0); -ms-transform: rotate(0); -webkit-transform: rotate(0); transform: rotate(0); width: auto; flex: 1; } }
.bigup .upnum em { display: block; }
.bigup .upnum span { font-size: 64px; font-size: 4rem; line-height: 0.9; font-family: 'myself'; color: #ef7e17; }
@media (max-width: 768px) { .bigup .upnum span { font-size: 48px; font-size: 3rem; } }
.bigup .upnum small { font-size: 24px; font-size: 1.5rem; font-family: 'myself'; }
.bigup .upnum i { display: block; font-size: 32px; font-size: 2rem; font-family: 'myself'; }
.bigup .text { flex: 1; border: 2px dashed #b2a7a0; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 8px; text-align: center; }
.bigup .text p { text-align: right; margin-top: 8px; }
@media (max-width: 768px) { .bigup .text { width: 100%; flex: auto; margin-top: 16px; } }
.bigup .balloon { padding-bottom: 32px; }

.middleup { margin: 24px 64px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
@media (max-width: 528px) { .middleup { margin: 24px 12px; } }
@media (max-width: 768px) { .middleup { -webkit-flex-direction: column; flex-direction: column; } }
.middleup > div { width: 49%; margin: 16px 0.5%; border: 2px dashed #675042; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; }
@media (max-width: 768px) { .middleup > div { width: 100%; } }
.middleup dt { font-size: 1.1em; font-weight: bold; background: #fff570; line-height: 1.4; padding: 0.4em 0.8em; }
.middleup dd { position: relative; padding: 0.6em; }
.middleup p { margin: 0; }
.middleup .point { font-family: "myself"; font-weight: bold; font-size: 32px; font-size: 2rem; padding: 16px 16px 0; z-index: 1; position: relative; line-height: 1; }
.middleup .point:before { content: url(/image/content/voice/up/middleup/img01.webp); position: absolute; top: 0; left: 0; z-index: 3; }
.middleup .point i { font-size: 88px; font-size: 5.5rem; letter-spacing: -6px; padding-right: 8px; color: #ef7e17; }
.middleup .from { position: absolute; z-index: 2; top: 16px; right: 0; line-height: 1; background: url(/image/content/voice/up/middleup/img02.webp) no-repeat center center/contain; font-size: 22px; font-size: 1.375rem; padding: 1em 0.6em; text-shadow: 2px 2px 0 white, 2px -2px 0 white, -2px 2px 0 white, -2px -2px 0 white, 2px 0 0 white, -2px 0 0 white, 0 2px 0 white, 0 -2px 0 white; }
.middleup .from .icon-arrow-right { margin: 0 0.3em; }
@media (max-width: 768px) { .middleup .from { top: 0; }
  .middleup .from em { display: block; } }
.middleup .textimg { padding: 16px 8px; text-align: center; }
.middleup .name { text-align: right; padding: 0 16px; }

.voice-trial { margin: 24px 64px; }
@media (max-width: 528px) { .voice-trial { margin: 24px 12px; } }
.voice-trial li { -moz-border-radius: 24px; -webkit-border-radius: 24px; border-radius: 24px; border: 5px solid #ef7e17; border-top-width: 32px; background: white; padding: 16px; margin: 32px 0; }
@media (max-width: 528px) { .voice-trial li { padding: 8px; } }
.voice-trial p { margin: 24px 0; }
.voice-trial .title { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
@media (max-width: 528px) { .voice-trial .title { -webkit-flex-direction: column-reverse; flex-direction: column-reverse; } }
.voice-trial .title p { flex: 1; }
.voice-trial .title img { width: 32%; margin-left: 16px; }
@media (max-width: 528px) { .voice-trial .title img { width: 80%; margin: 0 auto 16px; } }
.voice-trial .title span, .voice-trial .title i { display: block; line-height: 1.4; }
.voice-trial .title span { font-weight: bold; font-size: 1.1em; padding: 0.4em 0.6em; border-bottom: 2px dotted #675042; }
.voice-trial .title i { text-align: right; }
.voice-trial dt { font-weight: bold; border-bottom: 1px dashed #675042; padding: 0 0.4em; }
.voice-trial dd { padding-bottom: 32px; }
.voice-trial dd p { margin: 24px; }
@media (max-width: 528px) { .voice-trial dd p { margin: 24px 12px; } }
.voice-trial dd i { display: block; font-weight: bold; }
.voice-trial dd i::before { position: relative; top: 4px; left: -12px; }
.voice-trial dd .child::before { content: url(/image/content/voice/trial/icon-child.webp); }
.voice-trial dd .parent::before { content: url(/image/content/voice/trial/icon-parent.webp); }
.voice-trial .comment p { margin: 24px; }
@media (max-width: 528px) { .voice-trial .comment p { margin: 24px 12px; } }
.voice-trial .comment .title { margin: 24px 0; font-weight: bold; font-size: 1.1em; border-bottom: 2px dotted #675042; padding: 0 0.6em; }

.voice-area h2 { font-size: 18px; font-size: 1.125rem; background: url(/image/content/areas/parts/voice-lesson/headline/foot.webp) no-repeat center bottom/100%, url(/image/content/areas/parts/voice-lesson/headline/bg.webp) no-repeat center top/100%; max-width: 552px; margin: 0 auto 64px; padding: 16px 12px 40px; text-align: center; line-height: 1.4; font-weight: bold; position: relative; z-index: 2; }
.voice-area h2 i { font-size: 1.6em; }
.voice-area h2::after { position: absolute; content: url(/image/content/areas/parts/voice-lesson/headline/img01.webp); right: -32px; top: calc(100% - 32px); z-index: 3; }
@media (max-width: 528px) { .voice-area h2::after { right: 0; } }
@media (max-width: 528px) { .voice-area h2 { width: 100%; }
  .voice-area h2:before { right: 0; top: -64px; } }
.voice-area ul { margin: 24px 64px; }
@media (max-width: 528px) { .voice-area ul { margin: 24px 12px; } }
.voice-area li { -moz-border-radius: 24px; -webkit-border-radius: 24px; border-radius: 24px; border: 5px solid #ef7e17; border-top-width: 32px; background: white; padding: 16px; margin: 32px 0; }
@media (max-width: 528px) { .voice-area li { padding: 8px; } }
.voice-area dt { padding: 24px 12px 12px; background: url(/image/common/line/dash-brown.webp) no-repeat center top; }
.voice-area dt:first-child { padding-top: 0.6em; background: none; }
.voice-area dt span { background: #75bacc; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; color: white; padding: 0.3em; margin-left: 32px; position: relative; font-size: 0.9em; font-weight: bold; }
.voice-area dt span:before { position: absolute; right: calc(100% + 8px); top: 0.3em; }
.voice-area dt span.child-title:before { content: url(/image/content/areas/parts/voice-data/icon-child.webp); }
.voice-area dt span.parent-title:before { content: url(/image/content/areas/parts/voice-data/icon-parent.webp); }
.voice-area dd { padding: 0 12px 32px; }
.voice-area .bnr { margin: 8px 0 16px; }
.voice-area .comment { padding: 24px 12px 12px; background: url(/image/common/line/dash-brown.webp) no-repeat center top; }
.voice-area .comment span { background: #75bacc; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; color: white; padding: 0.3em; font-size: 0.9em; font-weight: bold; }
.voice-area .comment p { margin-top: 16px; }
.voice-area p { margin: 0; }

.postlist { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; width: 94%; max-width: 1024px; margin: 24px auto; }
.postlist li { position: relative; width: calc(100% / 3); min-height: 320px; min-width: 180px; padding: 8px; line-height: 1.4; }
@media (max-width: 1024px) { .postlist li { width: 50%; min-height: 0; } }
@media (max-width: 528px) { .postlist li { width: 100%; } }
.postlist a { display: block; height: 100%; border: 1px solid #f4f2f1; overflow: hidden; color: #675042; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; background: white; }
.postlist a:hover { border-color: #ef7e17; }
.postlist a div { height: 170px; background-repeat: no-repeat; background-position: center; background-size: cover; background-color: #fcf6db; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; overflow: hidden; }
.postlist .title { font-size: 0.9em; padding: 0.6em 0.8em; margin: 0; }

.list-area { margin: 24px 64px; }
@media (max-width: 528px) { .list-area { margin: 24px 12px; } }
.list-area dt { position: relative; background: #ef7e17; color: white; padding: 6px 40px 6px 12px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; border: 1px solid #fcf6db; line-height: 1.4; }
.list-area dt::before { content: "\f041"; font-family: icon; padding-right: 0.2em; line-height: 1; font-size: 1.2em; }
.list-area dt a { color: white; text-decoration: underline; }
.list-area dt a:hover { color: #fee7d1; }
.list-area dd ul { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; padding: 8px 0 32px; }
.list-area dd li { width: 25%; padding: 0 8px 0 0; }
@media (max-width: 528px) { .list-area dd li { width: 50%; } }
.list-area dd a { display: block; padding: 4px 8px; border-bottom: 1px dotted #b2a7a0; color: #675042; font-size: 16px; font-size: 1rem; }
.list-area dd a::before { content: "\f105"; font-family: icon; padding-right: 0.2em; line-height: 1; color: #ef7e17; }
.list-area dd a:hover { color: #ef7e17; background: #fcf6db; }
.list-area .title { font-weight: bold; color: #ef7e17; border-bottom: 2px dashed #fff570; padding: 4px 8px; margin: 0; }

aside.news { padding: 64px 0; }
aside.news dl { max-width: 928px; background: url(/image/content/index/img17.webp) no-repeat right top white; margin: 0 auto; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 32px; position: relative; }
@media (max-width: 528px) { aside.news dl { padding: 32px 8px; } }
aside.news dl::before { content: url(/image/content/index/img17.webp); position: absolute; top: 0; right: 0; }
aside.news dt { border-bottom: 5px dotted #fff570; font-weight: bold; padding: 0 8px 4px; margin-top: 64px; }
aside.news dt:first-of-type { margin-top: 0; }
aside.news dd { margin: 0 8px; padding: 8px 16px; border-bottom: 2px dashed #e3dfdc; }
@media (max-width: 528px) { aside.news dd { padding: 8px; } }
aside.news dd a { color: #675042; }
@media (max-width: 528px) { aside.news dd a { display: block; margin: 8px 0; line-height: 1.4; } }
aside.news i { background: #fff570; display: inline-block; width: 8.6em; color: white; font-size: 14px; font-size: 0.875rem; padding: 0 6px; margin-right: 8px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
aside.news i.info { color: #675042; }
aside.news i.refusal { background: #ef7e17; }
aside.news i.develop { background: #e6998a; }
aside.news i.study { background: #4b93b4; }

.bar_index { background: white; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; }
@media (max-width: 528px) { .bar_index { -webkit-flex-direction: column; flex-direction: column; } }
.bar_index ul { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; flex: 1; }
.bar_index li.pagelink a::after { content: "\f107"; }
.bar_index li.here a { background: #ebe7e6; color: #806352; }
@media (max-width: 1024px) { .bar_index li { flex: 1; } }
@media (max-width: 768px) { .bar_index li { flex: auto; width: 50%; } }
.bar_index div { background: #fff570; max-width: 24%; }
@media (max-width: 528px) { .bar_index div { max-width: 100%; } }
.bar_index a { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; padding: 0.8em 2.4em 0.8em 0.8em; color: #675042; font-weight: bold; font-size: 0.8em; line-height: 1.4; height: 100%; position: relative; }
.bar_index a:hover { background: #ebe7e6; color: #806352; }
.bar_index a::after { content: "\f105"; font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; right: 8px; top: calc(50% - 0.5em); }
@media (max-width: 1024px) { .bar_index a { padding: 0.8em 1.6em 0.8em 0.8em; } }
.bar_index + h1 { background: url(/image/common/bg.webp); text-align: center; padding: 32px 0; }
@media (max-width: 528px) { .bar_index + h1 { padding: 16px 8px; } }

.tab-section { position: relative; padding: 40px 0 160px; }
.tab-section:last-child { padding-bottom: 64px; }
.tab-section h3 { position: absolute; bottom: 100%; left: 10%; background: url(/image/common/bg.webp); color: orange; font-size: 16px; font-size: 1rem; padding: 0.4em 3em; -moz-border-radius: 12px 12px 0 0; -webkit-border-radius: 12px; border-radius: 12px 12px 0 0; }
@media (max-width: 528px) { .tab-section h3 { font-size: 14px; font-size: 0.875rem; left: 2%; } }
.tab-section:nth-of-type(odd) { background: white; }
.tab-section:nth-of-type(odd) h3 { background: white; }
@media (max-width: 528px) { .tab-section { padding-bottom: 80px; } }
.tab-section .txt01 { margin-top: 80px; }
.tab-section .txt02 { font-size: 24px; font-size: 1.5rem; color: #ef7e17; padding-left: 0; font-weight: bold; }
@media (max-width: 528px) { .tab-section .txt02 { font-size: 20px; font-size: 1.25rem; } }

.best3 { background: white; padding: 32px 0 64px; }
.best3 .best3-list { max-width: 928px; background: #191919; margin: 0 auto; }
.best3 .best3-list > li { padding: 16px; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: center; align-items: center; border: 1px solid white; }
@media (max-width: 528px) { .best3 .best3-list > li { padding: 16px 8px; } }
@media (max-width: 528px) { .best3 .best3-list > li > img { margin-right: 8px; } }
.best3 .best3-list > li .bookblock { -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.6) inset; -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.6) inset; box-shadow: 0 0 3px rgba(0, 0, 0, 0.6) inset; }
@media (max-width: 528px) { .best3 .best3-list > li .bookblock { flex: 1; } }
.best3 .best3-list > li:nth-of-type(1) .open { background: url(/image/content/index/best3/no01.webp) no-repeat center/contain; }
.best3 .best3-list > li:nth-of-type(2) .open { background: url(/image/content/index/best3/no02.webp) no-repeat center/contain; }
.best3 .best3-list > li:nth-of-type(3) .open { background: url(/image/content/index/best3/no03.webp) no-repeat center/contain; }
.best3 .best3-list > li a { position: relative; display: inline-block; color: white; text-align: center; }
@media (max-width: 528px) { .best3 .best3-list > li a { width: 100%; margin-top: 16px; } }
.best3 .best3-list > li a:hover { opacity: 0.9; color: #fff570; }
.best3 .best3-list > li a span { text-align: left; position: absolute; line-height: 1.4; width: 100%; height: 100%; top: 0; left: 0; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; -webkit-align-items: center; align-items: center; padding: 8px 32px; }

.strength { background: white; padding: 32px 0 0; }

.list-strength { max-width: 928px; margin: 0 auto; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
@media (max-width: 528px) { .list-strength { -webkit-flex-direction: column; flex-direction: column; width: 94%; max-width: 1024px; margin: 24px auto; } }
.list-strength > div { width: calc(100% / 3); padding: 32px 0; }
@media (max-width: 528px) { .list-strength > div { width: 100%; } }
.list-strength dt { text-align: center; }
.list-strength dt span { display: block; font-size: 24px; font-size: 1.5rem; font-weight: bold; }
.list-strength dd p { margin: 0; padding: 16px; line-height: 1.4; font-size: 16px; font-size: 1rem; }

.course { margin-top: 128px; }

.list-course { max-width: 928px; margin: 32px auto 0; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; }
@media (max-width: 528px) { .list-course { -webkit-flex-direction: column; flex-direction: column; width: 94%; max-width: 1024px; margin: 24px auto; } }
.list-course li { width: calc(100% / 3); text-align: center; padding: 8px 16px 64px; }
@media (max-width: 528px) { .list-course li { width: 100%; } }
.list-course p { margin: 0; text-align: left; line-height: 1.4; font-size: 16px; font-size: 1rem; font-weight: bold; padding: 8px 0 16px; }
.list-course a { display: block; background: #fff570; border: 1px solid #ef7e17; -moz-box-shadow: 0px 3px 0px #ef7e17; -webkit-box-shadow: 0px 3px 0px #ef7e17; box-shadow: 0px 3px 0px #ef7e17; color: #675042; padding: 12px 16px; -moz-border-radius: 48px; -webkit-border-radius: 48px; border-radius: 48px; font-weight: bold; position: relative; }
.list-course a:hover { background: #fe9; }
.list-course a::after { content: "\f105"; font-family: icon; padding-right: 0.2em; line-height: 1; position: absolute; top: calc(50% - 0.5em); right: 8px; color: #ef7e17; }

.flag-dl { width: 94%; max-width: 1024px; margin: 24px auto; }
.flag-dl > div { margin: 32px 0; }
.flag-dl > div:first-child { margin-top: 16px; }
.flag-dl dt { border: 2px solid #f4f2f1; border-bottom: none; display: inline-block; font-weight: bold; -moz-border-radius: 12px 12px 0 0; -webkit-border-radius: 12px; border-radius: 12px 12px 0 0; padding: 0.4em 1.2em; }
.flag-dl dt::before { content: url(/image/parts/flag-dl/img01.webp); margin-right: 0.3em; }
.flag-dl dd { background: #f4f2f1; padding: 32px 0; }
.flag-dl dd > p, .flag-dl dd .img-right, .flag-dl dd .img-left { margin: 16px 32px; }
@media (max-width: 528px) { .flag-dl dd > p, .flag-dl dd .img-right, .flag-dl dd .img-left { margin: 16px; } }

#price .title-stripe img { margin-right: 16px; position: relative; top: -3px; }
@media (max-width: 528px) { #price .title-stripe img { position: static; display: block; margin-right: 0; margin-bottom: 8px; } }

.tel-block { display: none; }
@media (max-width: 528px) { .tel-block { display: block; } }
.tel-block a { display: block; margin: 16px 4px; position: relative; -moz-border-radius: 12px; -webkit-border-radius: 12px; border-radius: 12px; padding: 16px; padding-left: 52px; color: white; line-height: 1.3; }
.tel-block a.trial { background: #ef7e17; }
.tel-block a.member { background: #4b93b4; }
.tel-block a i { font-size: 30px; font-size: 1.875rem; position: absolute; line-height: 1; top: calc(50% - 0.5em); left: 16px; }
.tel-block a em { font-size: 20px; font-size: 1.25rem; }
.tel-block small { display: block; font-size: 12px; font-size: 0.75rem; }

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