@charset "UTF-8";
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 100; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 200; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 300; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Medium"); font-weight: 400; }
@font-face { font-family: "Yu Gothic"; src: local("Yu Gothic Bold"); font-weight: bold; }
@font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 100; }
@font-face { font-family: "Helvetica Neue"; src: local("Helvetica Neue Regular"); font-weight: 200; }
.key_visual { padding-bottom: 100px; background: url(../images/key_visual-bg.png) repeat-x top left #ddecf1; }
@media screen and (max-width: 767px) { .key_visual { padding-bottom: 30px; } }

@media screen and (max-width: 767px) { .key_visual .item { padding: 0 15px; } }

.key_visual_inner { margin-bottom: 35px; }
@media screen and (max-width: 767px) { .key_visual_inner { margin-bottom: 20px; } }

@media screen and (min-width: 768px) { .key_banner ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; /*justify-content: center;*/ } }
@media screen and (min-width: 768px) { .key_banner li { width: 50%; width: calc(50% - 10px); margin: 0 0 1rem; } }
@media screen and (max-width: 767px) { .key_banner li { text-align: center; margin-bottom: 15px; }
  .key_banner li:last-of-type { margin-bottom: 0; } }
.key_banner a { display: inline-block; }

.top_info_box { margin-top: 30px; background-color: #f9f9ef; border: #115191 2px solid; }
.top_info_box p.info_ttl { color: #ff0000; font-size: 1.5em; font-weight: bold; text-align: center; margin: 20px; }
.top_info_box p.top_info_txt { color: #ff0000; font-size: 1.3em; line-height: 130%; margin: 20px; }
.top_info_box p.top_info_txt .top_info_txt_bold { font-weight: bold; }
.top_info_box p.top_info_txt02 { text-align: center; font-size: 1.4em; border-radius: 8px; padding: 5px; background: #ffff00; font-weight: bold; border: 2px solid #115191; margin: 0 30px; }

.info_banner { margin-bottom: 15px; }
.info_banner li:first-of-type { margin-right: 10px; }

@media screen and (min-width: 768px) { .news { background: url(../images/news_bg.png) no-repeat center bottom; background-size: cover; } }
@media screen and (max-width: 767px) { .news { background: #fbfbfb; } }

.news h2 { font-size: 2.03em; font-weight: 500; }
@media screen and (max-width: 767px) { .news h2 { text-align: center; font-size: 6.5vmin; margin-bottom: 1em; line-height: 1.2; } }

.news h2 span { display: block; text-align: center; margin-top: 10px; }
@media screen and (max-width: 767px) { .news h2 span img { width: 33px; } }

@media screen and (min-width: 768px) { .news > .container { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } }

.news .new { display: none; }

@media screen and (min-width: 768px) { .news-box { width: 700px; height: 325px; background: #fff; padding: 30px; } }
@media screen and (max-width: 767px) { .news-box { height: 315px; margin-right: -15px; margin-left: -15px; padding: 15px; background: #fff; } }
.news-box dl { height: 100%; overflow: auto; }

.news_title { color: #115191; font-weight: bold; font-size: 1.2em; line-height: 1.3; }

.news_title .date { display: block; font-size: .8em; color: #2395b0; font-weight: normal; margin: 5px 0 10px; }

.news_title { margin-top: 30px; padding-top: 30px; border-top: dotted 1px #bbb; }
.news_title:first-of-type { padding-top: 0; margin-top: 0; border-top: 0; }

.news-banner { margin: 40px auto 0; }
.news-banner li { margin-bottom: 20px; text-align: center; }
.news-banner li:last-of-type { margin-bottom: 0; }
.news-banner li a { display: inline-block; }

@media screen and (min-width: 768px) { .symptom-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

.symptom-list a { color: #2298b2; display: block; }

.symptom-list .item { text-align: center; }
@media screen and (min-width: 768px) { .symptom-list .item { margin-right: 30px; }
  .symptom-list .item:last-of-type { margin-right: 0; } }
@media screen and (max-width: 767px) { .symptom-list .item { margin-bottom: 30px; }
  .symptom-list .item:last-of-type { margin-bottom: 0; } }

.symptom-list .item figure { margin-bottom: 20px; }
@media screen and (max-width: 767px) { .symptom-list .item figure { width: 75%; margin: 0 auto 10px; } }

.symptom-list .item p { font-size: 26px; font-weight: bold; line-height: 1.3; }
@media screen and (max-width: 767px) { .symptom-list .item p { font-size: 1.2em; } }

.symptom-list .item p span { font-size: 16px; display: block; }
@media screen and (max-width: 767px) { .symptom-list .item p span { font-size: .77em; } }

.charac { background: url(../images/index-charac-bg.jpg) no-repeat #d8eaf6 top center; background-size: cover; }

@media screen and (min-width: 768px) { .charac > .container { padding-left: 40px; padding-right: 40px; } }

.charac-list li { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 30px; background: #fff; }
.charac-list li:last-of-type { margin-bottom: 0; }
@media screen and (max-width: 767px) { .charac-list li { margin-bottom: 15px; } }

.charac-list figure { width: 396px; }
@media screen and (max-width: 767px) { .charac-list figure { display: none; } }

@media screen and (min-width: 768px) { .charac-list p { width: calc(100% - 396px); padding: 27px 30px; font-size: 16px; } }
@media screen and (max-width: 767px) { .charac-list p { padding: 15px; } }

.charac-list p strong { display: block; color: #2298b2; line-height: 1.3; }
@media screen and (min-width: 768px) { .charac-list p strong { font-size: 24px; } }
@media screen and (max-width: 767px) { .charac-list p strong { font-size: 1.2em; margin-bottom: 10px; } }

@media screen and (max-width: 767px) { .guide h2 { text-align: left; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 3px solid #2298b2; } }

@media screen and (min-width: 768px) { .guide-menu { margin-bottom: 20px; } }
@media screen and (max-width: 767px) { .guide-menu { margin-bottom: 20px; } }

@media screen and (min-width: 768px) { .guide-menu li { width: 233px; height: 233px; border: 3px solid #2298b2; text-align: center; margin-right: 29px; margin-bottom: 30px; }
  .guide-menu li:nth-of-type(4n) { margin-right: 0; } }
@media screen and (max-width: 767px) { .guide-menu li { width: 100%; } }

.guide-menu a { display: block; width: 100%; height: 100%; color: #2298b2; }
@media screen and (min-width: 768px) { .guide-menu a { padding: 27px; background: #f6fbfe; }
  .guide-menu a i { display: none; } }
@media screen and (max-width: 767px) { .guide-menu a { padding: 5px 8px; font-size: 1.2em; border-bottom: 1px solid #e4e4e4; }
  .guide-menu a i { margin-right: 5px; } }

@media screen and (min-width: 768px) { .guide-menu img { display: block; margin: 0 auto 12px; } }
@media screen and (max-width: 767px) { .guide-menu img { display: none; } }

@media screen and (min-width: 768px) { .guide-menu span { display: block; font-weight: bold; font-size: 26px; } }

.guide-picmenu { margin-bottom: 45px; }
@media screen and (max-width: 767px) { .guide-picmenu { margin-bottom: 10px; } }

@media screen and (min-width: 768px) { .guide-picmenu li { width: 322px; margin-right: 27px; }
  .guide-picmenu li:last-of-type { margin-right: 0; } }
@media screen and (max-width: 767px) { .guide-picmenu li { width: 48%; width: calc(50% - 5px); margin-bottom: 10px; } }

@media screen and (min-width: 768px) { .guide-consultation { padding-left: 95px; }
  .guide-consultation strong, .guide-consultation b, .guide-consultation p { display: block; padding-left: 200px; } }
@media screen and (max-width: 767px) { .guide-consultation strong, .guide-consultation b, .guide-consultation p { display: block; } }

@media screen and (min-width: 768px) { .guide-consultation a { display: inline-block; } }
@media screen and (max-width: 767px) { .guide-consultation a { display: block; padding: 15px; border: 2px solid #2298b2; border-radius: 8px; } }

.guide-consultation p { margin-bottom: 7px; }

.guide-consultation strong { font-size: 1.87em; line-height: 1.3; color: #2298b2; }
@media screen and (max-width: 767px) { .guide-consultation strong { font-size: 4.8vmin; } }

.guide-consultation b { font-size: 1.48em; color: #ffbc07; }
@media screen and (max-width: 767px) { .guide-consultation b { font-size: 3.8vmin; } }

@media screen and (min-width: 768px) { .guide-consultation .c-btn { margin-left: 200px; } }

.guide-consultation div { display: inline-block; }

.guide-consultation img { float: left; margin-right: 30px; margin-top: 24px; }

.primary { background: url(../images/greeting_bg.jpg) no-repeat center #f8f8f8; background-size: cover; }
@media screen and (max-width: 767px) { .primary { background: #fff; } }

.primary .c-title { text-align: left; margin-bottom: 15px; font-size: 30px; }
@media screen and (max-width: 767px) { .primary .c-title { font-size: 5.6vmin; line-height: 1.2; text-align: center; } }

.primary p { margin-bottom: 20px; }
@media screen and (min-width: 768px) { .primary p { font-size: 16px; } }

.primary a i { color: #2298b2; }

/* モーダル -------------------------------------- */
#modal_bg { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; cursor: pointer; background: rgba(3, 26, 59, 0.6); -webkit-backdrop-filter: blur(0.6rem); backdrop-filter: blur(0.6rem); z-index: 2147483647; }

#modal { display: none; position: fixed; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: calc(100% - 2rem); max-height: 70vh; background: #fff; border-radius: 0.5rem; padding: 2rem; overflow-y: auto; z-index: 2147483647; }
@media screen and (min-width: 768px) { #modal { width: calc(50% - 2rem); } }
#modal section + section { margin-top: 2.5rem; }
#modal #modal_close { background: #0054a6; border-radius: 3rem; color: #fff; padding: 0.6rem 3rem; text-align: center; margin: 5px auto; width: auto; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 0.1rem solid #0054a6; -webkit-transition: background 1s; transition: background 1s; line-height: 1; font-size: 90%; cursor: pointer; }
#modal #modal_close:hover { border: 0.1rem solid #0054a6; color: #0054a6 !important; background: #fff; }

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