@charset "UTF-8";
/* Scss Document */
/* Scss Document */
/*-----------------*/
/* 
--------------------------------------------------------- */
/* VWはSPのみ利用
--------------------------------------------------------- */
/* ↓↓↓↓↓↓↓↓↓↓client 指定↓↓↓↓↓↓↓↓↓↓↓
--------------------------------------------------------- */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, a { margin: 0; padding: 0; outline: 0; border: 0; background: transparent; vertical-align: baseline; font-size: 100%; }
@media (max-width: 750px) { html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video, a { font-size: 90%; } }

/* user指定*/
html, body, button, input, select, textarea { font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, Verdana, Meiryo, "M+ 1p", sans-serif; }

/* IE表示用のCSS　user指定*/
@media all and (-ms-high-contrast: none) { html, body, button, input, select, textarea { font-family: "メイリオ",Meiryo,"游ゴシック",YuGothic,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic",sans-serif; } }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

* { -webkit-box-sizing: border-box; box-sizing: border-box; }

html { /* 基本の文字サイズは62.5%で指定　user指定*/ font-size: 62.5%; overflow: auto; letter-spacing: .075em; scroll-behavior: smooth; }
@media (max-width: 750px) { html { /*  font-size: 90%;  */ } }

html, body { overflow-x: hidden; }

body { color: #30363b; }

/* ↑↑↑↑↑↑↑↑↑user 指定↑↑↑↑↑↑↑↑↑↑↑
--------------------------------------------------------- */
ol, ul { list-style: none; }

a { color: #1c1c1c; text-decoration: none; }

/* base
--------------------------------------------------------- */
a:hover { text-decoration: none; -moz-opacity: 0.73; opacity: 0.73; /*  display: block;*/ }

.pcN { display: none; }

.br-sp { display: none; }

@media (max-width: 750px) { .sp_none { display: none !important; } }

.pc_none { display: none !important; }
@media (max-width: 750px) { .pc_none { display: block !important; } }

.inbl { display: inline-block !important; }

.pd_btm_20 { padding-bottom: 20px; }

.pd_btm_30 { padding-bottom: 30px; }

.pd_btm_40 { padding-bottom: 40px; }

.pd_btm_50 { padding-bottom: 50px; }

.pd_btm_60 { padding-bottom: 60px; }

.pd_btm_80 { padding-bottom: 80px; }

.pd_btm_90 { padding-bottom: 90px; }

.pd_top_15 { padding-top: 1.5em; }

.pd_top_25 { padding-top: 25px; }

.pd_top_50 { padding-top: 50px; }

.pd_lt_30 { padding-left: 30px; }

.pd_lt_40 { padding-left: 40px; }

.pd_lt_50 { padding-left: 50px; }

.mg_left_10 { margin-left: 10px; }

.mg_btm_50 { margin-bottom: 50px; }

.ttl-small01 { text-align: left; }

.ttl-large01 { font-weight: 500; text-align: center; padding: 0; }

.ttl-big01 { font-weight: 500; text-align: center; padding: 0; }

/* ========================================================= common
========================================================= */
@media (max-width: 750px) { .sp--img-over { padding-bottom: 1em; } }
@media (max-width: 750px) { .sp--img-over img { width: 100%; height: auto; } }

.ttl--01 { font-size: 4.2rem; font-weight: 500; font-family: ryo-text-plusn, serif; line-height: 1.3em; }
@media (max-width: 750px) { .ttl--01 { font-size: 3.2rem; } }

.ttl--02 { font-size: 3.3rem; font-weight: 500; font-weight: 500; font-family: ryo-text-plusn, serif; line-height: 1.5em; }
@media (max-width: 750px) { .ttl--02 { font-size: 2.3rem; } }
/*------調整---
.ttl--03 { font-size: 4rem; font-weight: 500; font-family: ryo-text-plusn, serif; }
@media (max-width: 750px) { .ttl--03 { font-size: 3rem; line-height: 1.8em; } }
-----調整------*/
.ttl--03 { font-size: 4rem; font-weight: 500; font-family: ryo-text-plusn, serif; margin: 3rem 0 0 0; }
@media (max-width: 750px) { .ttl--03 { font-size: 3rem; line-height: 1.8em; } }

.ttl--ft-01 { font-size: 2.2rem; font-weight: 500; font-family: "メイリオ",sans-serif; line-height: 2.2em; }

.text--or-def01 { line-height: 1.8em; font-size: 3rem; color: #FF9900; font-weight: 500; }

.ct--01 { text-align: center; }

#top-problem { padding: 10em 0 0 0; margin: 0 auto; text-align: center; }
@media (max-width: 750px) { #top-problem { width: 90%; margin: 0 auto; } }

.btn--area { padding: 10em 0; margin: 0 auto; max-width: 1250px; }
@media (max-width: 750px) { .btn--area { padding: 5em 0; } }

.mg--center { margin: 0 auto; }

.movie--area { margin: 5em 0; }
@media (max-width: 750px) { .movie--area { position: relative; width: 100%; padding-top: 56.25%; } }

@media (max-width: 750px) { .movie--area iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; } }

.tx--lt { text-align: left !important; }

#inq--area { max-width: 793px; width: 100%; margin: 0 auto; text-align: center; padding: 5em 0 10em 0; }
@media (max-width: 750px) { #inq--area { width: 90%; padding: 5em 0 5em 0; } }
#inq--area .phone_number { border-top: solid #000 1px; padding-top: 0.4em; padding-bottom: 0.4em; font-size: 5.1rem; font-weight: 600; font-family: "メイリオ",sans-serif; }
@media (max-width: 750px) { #inq--area .phone_number { font-size: 3.8rem; } }
#inq--area .phone_number::before { content: ""; display: inline-block; width: 42px; height: 63px; background-image: url(../images/common/icon_phone.png); background-size: contain; vertical-align: middle; background-repeat: no-repeat; padding-right: 20px; }
@media (max-width: 750px) { #inq--area .phone_number::before { width: 32px; height: 53px; padding-right: 17px; } }

/* new
--------------------------------------------------------- */
.an-link { text-align: right; }
.an-link a { color: #003670; }

.tec--list { display: flex; justify-content: center; flex-wrap: nowrap; margin: 0 auto; padding-top: 10em; }
@media (max-width: 750px) { .tec--list { justify-content: space-between; width: 90%; margin: 0 auto; padding-top: 5em; } }
.tec--list li { padding: 0 1.5em; }
@media (max-width: 750px) { .tec--list li { padding: 1em 0; width: 32%; } }
@media (max-width: 750px) { .tec--list li img { width: 100%; height: auto; } }

#visual_img--top { position: relative; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); }
#visual_img--top .contents--ttl { vertical-align: bottom; position: absolute; bottom: 0%; right: 0%; }
#visual_img--top img { vertical-align: bottom; display: block; width: 100%; height: auto; }

.page--link { color: #FF9900; text-decoration: underline; }

/*#top-inq-btn-common { background: #FF9900; width: 70px; z-index: 60; height: 100%; color: #FFF; position: fixed; right: 0; bottom: 70px; font-size: 3rem; padding-top: 280px; }
#top-inq-btn-common a { color: #FFF; text-align: center; font-weight: 500; display: block; width: 70px; padding-right: 0.5em; padding-left: 0.5em; box-sizing: border-box; font-weight: 500; font-family: ryo-text-plusn, serif; line-height: 1.6em; }
@media (max-width: 750px) { #top-inq-btn-common a { width: 64px; } }
#top-inq-btn-common i { padding-top: 2em; }*/

#top-inq-btn { 　position: -webkit-sticky; 　position: sticky; top: 70px; right: 0; bottom: 0; background: #FF9900; color: #FFF; writing-mode: vertical-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; height: 100%; width: 70px; right: 0; top: 0px; z-index: 60; font-size: 2.0rem; overflow: hidden; }
@media (max-width: 750px) { #top-inq-btn { width: 64px; font-size: 2.2rem; } }
#top-inq-btn a { text-align: center; color: #FFF; font-weight: 500; display: block; height: 100%; width: 100px; padding-right: 1em; box-sizing: border-box; padding-right: 0.7em; }
@media (max-width: 750px) { #top-inq-btn a { width: 64px; } }
#top-inq-btn i { padding-top: 2em; }

#page_top { position: fixed; right: 0; bottom: 0; /* background: #CC0000;*/ z-index: 80; /* opacity: 0.6;*/ }
#page_top a { position: relative; display: block; width: 70px; height: 80px; text-decoration: none; background: #003670; }
@media (max-width: 750px) { #page_top a { width: 70px; height: 60px; } }
#page_top a:before { content: ''; position: absolute; width: 14.63px; height: 11.95px; top: 8px; bottom: 0; right: 0; left: 0; margin: auto; text-align: center; background-image: url("../images/common/totoparrow.png"); background-repeat: no-repeat; }
#page_top span { color: #FFF; text-align: center; writing-mode: vertical-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; padding-left: 40%; padding-bottom: 60px; }
#page_top span::after { content: ""; /*描画位置*/ position: absolute; width: 1px; height: 30px; background-color: #FFF; left: 48%; top: 30%; }
@media (max-width: 750px) { #page_top span { display: none; } }

.c-og { color: #FF9900; }

.link__arrow { position: relative; /* display: inline-block;*/ padding: 0 20px 0 0; /*vertical-align: middle;*/ text-decoration: none; font-size: 1.4rem; }
.link__arrow::before { position: absolute; top: 0; bottom: 0; right: 0; margin: auto; content: ""; /*vertical-align: middle;*/ }
.link__arrow::after { position: absolute; top: 0; bottom: 0; right: 0; margin: auto; content: ""; /* vertical-align: middle;*/ }

.arrow_b { position: relative; display: inline-block; padding-left: 20px; color: #FF9900; text-decoration: none; }

.arrow_b:before { content: ''; width: 6px; height: 6px; border: 0; border-top: solid 2px #FF9900; border-right: solid 2px #FF9900; position: absolute; top: 50%; left: 0; margin-top: -4px; transform: rotate(45deg); }

.pt01::before { width: 16px; height: 16px; -webkit-border-radius: 50%; border-radius: 50%; background: #FF9900; }
.pt01::after { right: 5px; width: 5px; height: 5px; border-top: 1px solid #FFF; border-right: 1px solid #FFF; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.pt02::before { width: 12px; height: 12px; -webkit-border-radius: 50%; border-radius: 50%; background: #FF9900; }
.pt02::after { left: 3px; width: 3px; height: 3px; border-top: 1px solid #FFF; border-right: 1px solid #FFF; -webkit-transform: rotate(45deg); transform: rotate(45deg); }

.backg--01 { background: linear-gradient(#FF6C00, #FF9400); }

.backg--02 { background: linear-gradient(#FF6C00, #FF9500); }

.backg--user { background: #FF9900; }

.backg--user02 { background: #F9F9F9; }

.link--center { padding-top: 2em; text-align: center; }

.link--rt { text-align: right; }
@media (max-width: 750px) { .link--rt { padding-top: 2em; text-align: left; } }

.md__top { font-weight: 400; font-family: 'Noto Serif JP', serif; }

.wd--20 { width: 240px; }
@media (max-width: 750px) { .wd--20 { width: 100%; } }

.wd--80 { width: 910px; }
@media (max-width: 750px) { .wd--80 { width: 100%; } }

.bg_img { background: url(../images/common/header_bg.png); background-repeat: no-repeat; top: 0; left: 0; height: 188px; width: 100%; position: fixed; /* ウィンドウを基準に画面に固定 */ top: 0; /* 上下の固定位置を上から0pxにする */ left: 0; /* 左右の固定位置を左から0pxにする */ }
@media (max-width: 750px) { .bg_img { background: none; height: 60px; width: 100%; /*    height: auto; background-color: #FFF;*/ } }

.bg_img_contents { height: 188px; width: 100%; position: fixed; /* ウィンドウを基準に画面に固定 */ top: 0; /* 上下の固定位置を上から0pxにする */ left: 0; /* 左右の固定位置を左から0pxにする */ }
@media (max-width: 1800px) { .bg_img_contents { background: none; height: 80px; width: 100%; /*    height: auto; background-color: #FFF;*/ } }
@media (max-width: 750px) { .bg_img_contents { background: none; height: 80px; width: 100%; /*    height: auto; background-color: #FFF;*/ } }

.bg_img_contents::after { content: ''; background-color: rgba(0, 0, 0, 0.85); position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 70px; }
@media (max-width: 750px) { .bg_img_contents::after { position: static; background-color: none; /*  height: auto; background: #FFF;   */ } }

.bg_img::after { content: ''; background-color: rgba(0, 0, 0, 0.85); position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 70px; }
@media (max-width: 750px) { .bg_img::after { position: static; background-color: none; /*  height: auto; background: #FFF;   */ } }

header { z-index: 999; }

.sp_btn_inq { background: #FF6C00; padding: 0.8em 0.5em; font-weight: 500; color: #FFF; }
@media (max-width: 480px) { .sp_btn_inq { display: none; } }

#head_wrap { display: flex; justify-content: space-between; align-items: center; padding: 0em 0em; width: 100%; position: absolute; height: 70px; z-index: 1000; }
@media (max-width: 750px) { #head_wrap { height: auto; width: 100%; background: #FFF; } }
#head_wrap h1 { padding-left: 10px; }
@media (max-width: 750px) { #head_wrap h1 { padding-left: 0px; } }
#head_wrap h1 span { padding-left: 20px; }
@media (max-width: 750px) { #head_wrap h1 span { display: none; } }
#head_wrap h1 span img { max-width: auto; height: 28px; }
#head_wrap h1 img { max-width: auto; height: 35px; vertical-align: middle; }
@media (max-width: 750px) { #head_wrap h1 img { max-width: 100%; height: 70px; } }
#head_wrap .gloval__menu { color: #FFF; display: flex; flex-wrap: nowrap; height: 70px; align-items: center; white-space: nowrap; }
@media (max-width: 750px) { #head_wrap .gloval__menu { height: 100%; max-height: 70px; } }
#head_wrap .gloval__menu li { padding: 0 1.0em; font-weight: 600; font-size: 1.6rem; }
@media (max-width: 750px) { #head_wrap .gloval__menu li { padding: 0 0em; } }
#head_wrap .gloval__menu li a { color: #FFF; text-decoration: none; }

.contact_link_ft { display: flex; justify-content: center; padding: 3em 0; font-weight: 600; align-items: center; font-size: 1.4rem; }
@media (max-width: 750px) { .contact_link_ft { display: block; padding: 1.5em 0; } }
.contact_link_ft dt { padding: 0 1.5em; }
@media (max-width: 750px) { .contact_link_ft dt { display: block; text-align: center; font-size: 6.6666666667vw; } }
.contact_link_ft dd { padding: 0 1.5em; }
@media (max-width: 750px) { .contact_link_ft dd { text-align: center; } }
.contact_link_ft dd img { vertical-align: top; }
.contact_link_ft .border--r { border-right: solid 1px #BCBCBC; }
@media (max-width: 750px) { .contact_link_ft .border--r { border: none; } }

/*▼▼▼FOOTER▼▼▼*/
footer .footer__dl { background: #212121; text-align: center; color: #FFF; padding: 5em 0; }
@media (max-width: 750px) { footer .footer__dl { padding: 2em 0; } }
footer .footer__dl .footer_logo { height: 35px; max-width: auto; }
@media (max-width: 750px) { footer .footer__dl .footer_logo { padding-top: 1.5em; display: block; height: auto; } }
footer .footer__dl .footer_logo span { padding-left: 20px; }
@media (max-width: 750px) { footer .footer__dl .footer_logo span { padding-top: 1.5em; padding-left: 0px; display: block; } }
footer .footer__dl .company_name { font-size: 1.2rem; }
footer .footer__dl .company_address { padding-top: 3em; padding-bottom: 3em; font-size: 1.2rem; }
@media (max-width: 750px) { footer .footer__dl .company_address { padding-top: 1em; } }
footer .footer__dl .company_link { font-size: 1.2rem; }
footer .footer__dl .company_link a { color: #FFF; }
footer .footer__dl .company_link a:link { color: #FFF; }
@media (max-width: 750px) { footer .footer__dl .company_link span { display: block; } }
footer #copy { text-align: center; background: #000000; color: #FFF; padding: 0 0; font-size: 1rem; line-height: 80.67px; }
@media (max-width: 750px) { footer #copy { line-height: 60px; } }

/* ボタン全体 */
.flowbtn17 { border-radius: 50%; position: relative; display: block; width: 30px; height: 30px; text-decoration: none; transition: .5s; background-color: #444; color: #fff; }
@media (max-width: 750px) { .flowbtn17 { margin: 20px auto; } }

/* ボタンマウスホバー時のテキスト指定 */
.flowbtn17:hover { text-decoration: none; }

/* アイコンをど真ん中に */
.flowbtn17 i { position: absolute; top: 50%; left: 50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }

/* Facebookマウスホバー時 */
.flowbtn17.fl_fb2:hover { background: -webkit-linear-gradient(top, #5c80c6 0%, #34528c 74%); background: linear-gradient(to bottom, #5c80c6 0%, #34528c 74%); }

/* ulタグの内側余白を０にする */
ul.snsbtniti2 { padding: 0 !important; }

/* ボタン全体の位置 */
.snsbtniti2 { display: flex; flex-flow: row wrap; }

/* ボタン同士の余白 */
.snsbtniti2 li { flex: 0 0 48%; text-align: center !important; }

/*矢印が右に移動する*/
.btnarrow1 { /*矢印と下線の基点とするためrelativeを指定*/ position: relative; /*形状*/ display: inline-block; padding: 0 0px; color: #000; text-decoration: none; outline: none; }
@media (max-width: 750px) { .btnarrow1 { display: none; } }

/*矢印と下線の形状*/
.btnarrow1::before { content: ''; /*絶対配置で下線の位置を決める*/ position: absolute; bottom: -30px; left: 0%; /*下線の形状*/ width: 100%; height: 1px; background: #000; /*アニメーションの指定*/ /* transition: all .3s;*/ }

.btnarrow1::after { content: ''; /*絶対配置で矢印の位置を決める*/ position: absolute; bottom: -22px; right: 0; /*矢印の形状*/ width: 26px; height: 1px; background: #000; transform: rotate(35deg); /*アニメーションの指定*/ /*transition: all .3s;*/ }

/*hoverした際の移動*/
.btnarrow1:hover::before { /*   left:20%;*/ }

.btnarrow1:hover::after { /*  right:-20%;*/ }

/*矢印が右に移動する*/
.btnarrow4 { /*矢印と下線の基点とするためrelativeを指定*/ position: relative; /*形状*/ display: inline-block; padding: 0 0px; color: #FFF; text-decoration: none; outline: none; }

/*矢印と下線の形状*/
.btnarrow4::before { content: ''; /*絶対配置で下線の位置を決める*/ position: absolute; bottom: -30px; left: 0%; /*下線の形状*/ width: 100%; height: 1px; background: #FFF; /*アニメーションの指定*/ /*transition: all .3s;*/ }
@media (max-width: 750px) { .btnarrow4::before { display: none; } }

.btnarrow4::after { content: ''; /*絶対配置で矢印の位置を決める*/ position: absolute; bottom: -22px; right: 0; /*矢印の形状*/ width: 26px; height: 1px; background: #FFF; transform: rotate(35deg); /*アニメーションの指定*/ /* transition: all .3s;*/ }
@media (max-width: 750px) { .btnarrow4::after { display: none; } }

/*hoverした際の移動*/
.btnarrow4:hover::before { /*left:20%;*/ }

.btnarrow4:hover::after { /*  right:-20%;*/ }
/*------調整---
.top__ttl { padding: 50px 0; text-align: center; color: #FFF; font-weight: 400; line-height: 1.2; font-size: 4rem; font-weight: 500; font-family: ryo-text-plusn, serif; }
-----調整------*/
.top__ttl { padding: 50px 0; text-align: center; color: #FFF; font-weight: 400; line-height: 1.2; font-size: 3rem; font-weight: 500; font-family: ryo-text-plusn, serif; }
@media (max-width: 750px) { .top__ttl { font-size: 3rem; padding: 1em 0.5em; box-sizing: border-box; } }

.top__ttl--black { padding: 0px 0; color: #000; font-weight: 300; font-family: 'Noto Serif JP', serif; }
@media (max-width: 750px) { .top__ttl--black { display: none; } }

#aboutus .aboutus__list { display: flex; flex-wrap: nowrap; }
@media (max-width: 750px) { #aboutus .aboutus__list { display: block; padding-bottom: 1em; } }
#aboutus .aboutus__list li { width: 25%; height: auto; }
@media (max-width: 750px) { #aboutus .aboutus__list li { width: 90%; margin: 0 auto; padding-top: 1em; } }
#aboutus .aboutus__list li a img { vertical-align: bottom; width: 100%; height: auto; }

.special_sp_text { width: 90%; margin: 0 auto; padding: 1em 0; }

#special { background: #FF9900; width: 100%; display: flex; justify-content: center; flex-wrap: nowrap; padding: 80px 0; }
@media (max-width: 750px) { #special { display: block; padding: 1em 0; } }
#special .special--title { max-width: 330px; color: #FFF; }
#special .special--title h2 { font-size: 3rem; }
#special .special--img { max-width: 1080px; }
@media (max-width: 750px) { #special .special--img { max-width: 96%; height: auto; margin: 0 auto; } }
#special .special--img img { max-width: 100%; height: auto; vertical-align: bottom; }
#special .special--text { padding: 50px 0; font-size: 1.4rem; }


/*----------------追加電話スマホ時だけ発動*/
@media(min-width: 768px){
    a[href^="tel:"]{
      pointer-events: none;
    }
  }