@charset "utf-8";
@import url("root.css");
/*-----*RESET CSS*-----*/
*:where(:not(iframe, canvas, img, svg, video):not(svg *)){all: unset;display: revert;}
*,*::before,*::after{box-sizing: border-box;}
ol,ul{list-style: none;}
img{max-width: 100%;vertical-align: bottom;}
/*-----*RESET CSS*-----*/

* {
font-size: min(2.5vw,10px);
line-height: 1.7;
word-break: break-all;
font-family: 'Noto Sans JP', 'Noto Sans', sans-serif;
font-weight: 400;
}

a:hover {
    cursor: pointer;
}

h2 {}
p,dt,dd,li,th,td,a,strong,h4,h5,h6,i,em,s,ins,del,sup,sub,tt,aside,article,header,footer,address,b,a,u{ font-size:1.6rem; }
strong {font-weight: bold;}
span,small { font-size:calc(1.6rem * 0.8); }

p {line-height: 2;}

body {
color: var(--base-color02);
background: var(--base-color03);
font-family: 'Noto Sans JP', 'Noto Sans', sans-serif;
font-weight: 200;

font-size: 16px;
}



@media screen and (max-width: 900px) {
h2 {}
p,dt,dd,li,th,td,a,strong,h4,h5,h6,i,em,s,ins,del,sup,sub,tt,aside,article,header,footer,address,b,a,u{ font-size:1.6rem;line-height: 1.6; }
strong {font-weight: bold;}
span,small { font-size:calc(1.4rem * 0.8); }


body {min-width:100%;}
}

/***************************************
---------------- 画像ふわっと　-----------
***************************************/
img.fadein-target {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1s ease, transform 1s ease;
}
img.fadein-target.fadein-show {
  opacity: 1;
  transform: translateY(0);
}
@media screen and (max-width: 900px) {
.order_01 {  order: 1;}
.order_02 {  order: 2;}
.order_03 {  order: 3;}
.order_04 {  order: 4;}
.order_05 {  order: 5;}
.order_06 {  order: 6;}
.order_07 {  order: 7;}
.order_08 {  order: 8;}
}
/***************************************
---------------- 共通 ----------------
***************************************/
.box{
margin: 0 auto;
width: 1200px;
padding:70px 0 110px 0;
text-align: center;
}

.txt_box{
margin: 0 auto;
width: 1200px;
padding:40px 0 0 0;
text-align:left;
}


.row{
display: flex;
flex-wrap: wrap;

}

.col{width: 50%;text-align: left;}

.col_03{
width: 380px;
margin:0 15px 0 0;
text-align: left;
}
.col_03:nth-child(3n){margin: 0 0 0 0;}

.col_04{
width: 285px;
margin:0 20px 30px 0;
text-align: left;
}
.col_04:nth-child(4n){margin: 0 0 30px 0;}


@media screen and (max-width: 900px) {
.box{
margin: 0 auto;
width:90%;
padding:40px 0;
}

.txt_box{
margin: 0 auto;
width:100%;
padding:40px 0;
}



.row{
display: flex;
flex-wrap: wrap;
justify-content:flex-start;
}

.col{
width: 100%;
margin:0;
}
.col:nth-child(2n){margin: 0;}


.col_03{
width: 48%;
margin:0 4% 5px 0;
}

.col_03:nth-child(3n){margin:0 4% 5px 0;}
.col_03:nth-child(2n){margin:0 0 5px 0;}

.col_04{
width: 48%;
margin:0 4% 5px 0;
}
.col_04:nth-child(2n){margin: 0 0 5px 0;}
.col_04:nth-child(4n){margin: 0 0 5px 0;}
}




/***************************************
---------------- リンク共通 ----------------
***************************************/
.link_a{
width: 200px;
border-radius: 50px;
color: var(--base-color03);
background: var(--base-gd);
display: inline-flex;
align-items: center;
justify-content:space-between;
padding: 10px 30px;
font-weight:600;
text-decoration: none;
transition: background 0.3s ease;
}


.link_a:hover {opacity: 0.8;}

.link_a .arrow {
font-size: 18px;
}

.link_b{
width: 300px;
border-radius: 10px;
color: var(--base-color03);
background: var(--base-gd);
display: inline-flex;
align-items: center;
justify-content:space-between;
padding: 15px 40px;
font-weight:600;
text-decoration: none;
transition: background 0.3s ease;
border: 1px solid var(--base-color03);
}


.link_b:hover {opacity: 0.8;}

.link_b .arrow {
font-size: 18px;
color: var(--base-color03);
}

@media screen and (max-width: 900px) {
.link_a{
width: 80%;
align-items: center;
justify-content:space-between;
padding: 10px 20px;
font-weight:600;
text-decoration: none;
transition: background 0.3s ease;
}


.link_a:hover {opacity: 0.8;}
.link_a a{font-size: 16px;}
.link_a .arrow {font-size: 18px;}

.link_b{
width: 80%;
padding: 15px 20px;
}


.link_b:hover {opacity: 0.8;}

.link_b .arrow {
font-size: 18px;
color: var(--base-color03);
}

}
/***************************************
---------------- h3/h4 ----------------
***************************************/
.title_a h3{
font-size: 36px;
font-weight: 600;
color: var(--base-color01);
font-family: 'Roboto', sans-serif;
line-height: 1.6;
}

.title_a span{font-size: 14px;}

@media screen and (max-width: 900px) {
.title_a h3{
font-size: 36px;
font-weight: 600;
color: var(--base-color01);
font-family: 'Roboto', sans-serif;
line-height: 1.6;
text-align: center;
margin: 0 auto;
}

.title_a span{font-size: 14px;text-align: center;}
}

/***************************************
---------------- HEADER ----------------
***************************************/

header {
padding:0;
background: var(--base-color03);
display: block;
margin: 0 auto;
height: 80px;
border-bottom: 2px solid var(--base-color04);
box-sizing: border-box;
}

header .header_wrap {
width: 96%;
max-width: 1400px;
margin: 0 auto;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
height: 100%;
box-sizing: border-box;
}

header .header_wrap h1 {
width: 14%;
min-width: 170px;
display: flex;
flex-wrap: nowrap;
align-items: center;
margin:0;
flex-grow: 1;
gap: 10px;
}

.header_menu {
display: flex;
flex-wrap: nowrap;
justify-content: flex-end;
align-items: center;
height: 80px;
width: 56%;
min-width: 650px;
padding: 0 10px 0 0;
}

.header_mail {
width: 15%;
min-width:170px;
max-width:180px;
color: var(--base-color01);
font-size: 15px;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content:flex-end;
box-sizing: border-box;
white-space: nowrap;
}

@media screen and (max-width:1170px) {
.header_mail{
display: none;
}
}


.header_mail_img{
width: 10%;
height: auto;
padding: 0 0 0 0;
margin: 0 0 0 0;
box-sizing: border-box;
margin: 0 auto 3px;
height: 100%;
}

.header_mail p{
width: 90%;
padding: 0 0 0 5px;
box-sizing: border-box;
line-height: 1;
font-size: 13px;
margin: 0 auto 5px;
}

.header_mail span{
line-height: 1;
font-size: 14px;
  width: 100%;
}

.header_contact {
width: 12.5%;
min-width: 150px;
}

@media screen and (max-width:1000px) {
.header_contact {
display: none;
}
}
.header_contact a{
color: var(--base-color03);
background: var(--base-gd);
width: 100%;
display: block;
text-align: center;
padding: 10px 0;
border-radius: 5px;
transition: color 0.3s ease;
font-size: 14px;
}
.header_contact a:hover{
color: #fafbea;
}

.header_contact i{padding: 0 5px 0 0;}

.navigation {}

.nav {}

.page_link {
display: flex;
justify-content:space-between;
align-items: stretch;
list-style: none;
padding: 0;
margin: 0;
height: 100%;
}

.page_link li {
padding:0;
height: 100%;
}

.page_link li a {
display: flex;
align-items: center;
height: 100%;
position: relative;
padding:0 5px;
text-decoration: none;
text-align: center;
font-weight: 400;
font-style: normal;
color: var(--base-color02);
line-height: 1.2;
margin:0 auto 0;
transition: color .25s ease;
font-size: 14.5px;
}

.page_link li a.current::before {
  content: '';
  position: absolute;
  top: 0;
  left:0;
  width: 100%;
  height: 3px;
  background-color: var(--base-color01);
}

.page_link li a:hover{color: var(--base-color01);}


.page_link > li:nth-child(2) a,
.page_link > li:nth-child(3) a,
.page_link > li:nth-child(4) a {
  color: var(--base-color01); /* ← 変更したい色 */
  font-weight: 600;
}
.submenu {
opacity: 0;
visibility: hidden;
transform: translateY(10px);
transition: all 0.3s ease;
position: absolute;
background-color:var(--base-color03);
list-style: none;
padding:12px 0;
z-index:999999;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
margin: -20px 0 0 0;
}


.has-submenu:hover .submenu {
opacity: 1;
visibility: visible;
transform: translateY(0);

}

.has-submenu i {
padding: 0 0 0 5px;

}


.submenu li a{
border-bottom: 1px solid var(--base-color04);
text-align: left;
width: 180px;
padding: 10px 0;
margin:0 12px;
box-sizing: border-box;
color: var(--base-color02);
font-weight: 400;
}
.submenu li:last-child a {border-bottom: none;padding:10px 0 0 0;}
.submenu li:first-child a {padding: 0 0 10px 0;}


.has-submenu {
position: relative;
}




#menu-btn-check,
.menu-btn,
.store_name {
display: none;
}

@media screen and (max-width: 900px) {
header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 60px;
background: var(--base-color03);
z-index: 999;
display: flex;
align-items: center;
border-top: 2px solid var(--base-color01);
padding: 0 10px;
}
.header_wrap {display: none;}


header .header_wrap {
min-width:100%;
max-width:100%;
}

header .header_wrap h1 {
width: min(60%, 200px);

}

.header_mail,.header_contact{
display: none;
}
header .header_wrap img {width:80%;}

.menu-btn {
position: fixed;
top: 10px;
right: 10px;
display: flex;
height: 40px;
width: 60px;
justify-content: center;
align-items: center;
z-index: 90;
color: var(--base-color03);
    background: var(--base-gd);
}
.menu-btn span.bar,
.menu-btn span.bar:before,
.menu-btn span.bar:after {
content: "";
display: block;
height: 2px;
width:40px;
background-color: var(--base-color03);
position: absolute;
}
.menu-btn span {
position: absolute;
bottom: 5px;
font-size: 12px;

color: var(--base-color03);
}
.menu-btn span.bar:before {top: -6px;}
.menu-btn span.bar {top:13px;}
.menu-btn span.bar:after {top: 6px;}
.menu-btn p {font-size: 10px;top:19px;position: absolute;}

#menu-btn-check:checked ~ .menu-btn span.bar {background-color: transparent; /* または opacity: 0; */}
#menu-btn-check:checked ~ .menu-btn span.bar::before {
top: 0;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
width:21px;
}
#menu-btn-check:checked ~ .menu-btn span.bar::after {
top: 0;
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
width:21px;
}
.navigation {
width: 100%;
height: calc(100% - 80px);
position: fixed;
top:60px;
left: 100%;/*leftの値を変更してメニューを画面外へ*/
z-index:99999;
background-color: var(--base-color03);
transition: all 0.5s;/*アニメーション設定*/
overflow-y: scroll;
padding-bottom: 40px;
height: 100%;
}


.navigation ul#page_link {
width: 100%;
padding:20px 0;
height: auto;

}

.navigation ul#page_link > li {
width: 100%;
margin: 0;
border-bottom: solid 1px var(--base-color03);
list-style: none;
color:var(--base-color03);
}

.navigation ul#page_link > li:last-of-type{
width: 100%;
margin: 0;
border-bottom: solid 0 var(--base-color_gr);
list-style: none;

}

.navigation ul#page_link li:not(:last-of-type)::after {content: none;}

.navigation ul#page_link > li a,
.navigation ul#page_link > li span {
display: block;
width: 100%;
height: auto;

box-sizing: border-box;
color:var(--base-color03);
text-decoration: none;
padding: 12px 10px 12px 10px;
position: relative;
line-height: 1.2;
box-sizing: border-box;
}

.navigation ul#page_link > li span {
font-size:14px;
line-height: 1.2;
padding: 0;
}

#page_link .txt_big a{
font-size: 20px;
font-weight: 600;
padding: 5px 0;
}

.navigation ul#page_link > li:before,
.navigation ul#page_link > li:last-of-type:after {
content: none;
}
.navigation ul#page_link > li a:hover,
.navigation ul#page_link > li span:hover {
background: none;
color: inherit;
}
#menu-btn-check:checked ~ .navigation {
left: 0;
background: var(--base-gd);
}


.submenu-toggle {display: none;}
.submenu {
display: none;
padding: 0 0;
margin: 0;
list-style: none;
border-top: 1px solid var(--base-color03);
}
.submenu {
position: static;
opacity: 1;
visibility: visible;
transform: none;
box-shadow: none;
background-color: var(--base-gd);

}

.submenu-toggle:checked ~ .submenu {display: block;}

.has-submenu label {
display: block;
padding:12px 10px;
cursor: pointer;
font-size: 1.8rem;
line-height: 1.2;
text-decoration: none;
}

.has-submenu .submenu li:last-child a {
border-bottom: none;
}
.has-submenu label::after {
  content: "＋";
  position: absolute;
  right: 10px;
  top: 12px; /* 上からの固定位置（必要に応じて調整） */
  font-size: 1.6rem;
  line-height: 1;
}

/* ▼ 追加：チェック時は「×」に切り替える */
.submenu-toggle:checked + label::after {
  content: "×";
}

.has-submenu .submenu li a {
padding:8px 10px 8px 20px !important;
margin: 0 auto !important;
display: block;
text-decoration: none;
border-bottom: 1px dotted var(--base-color03);
font-size: 14px !important;
}

.has-submenu .submenu li:last-child a {
  border-bottom: none;
}


}

/***************************************
---------------- LAYOUT ----------------
***************************************/
.container {
width:1200px;
margin: 0 auto 0;
padding:70px 0 110px 0;
}

.container_b {
width:100%;
margin: 0 auto 0;
padding:70px 0 110px 0;
}

.container_c {
width:100%;
margin: 0 auto 0;
padding:0 0 110px 0;
}

@media screen and (max-width:1199px){
.container {
width:100%;
padding: 40px 0;
}

.container_b {
width:100%;
margin: 0 auto 0;
padding: 40px 0;
}

.container_c {
width:100%;
margin: 0 auto 0;
padding: 40px 0;
}

}
@media screen and (min-width:900px){
.sp { display:none; }
}
@media screen and (max-width:900px){
.pc { display:none; }
.sp { display:block; }
.left_contents {
width:100%;
margin-right: 10px;
}
#sidebar { width:100%; }
}


#pagetitle {
width: 100%;
height: 500px;
padding: 0;
background: url("../img/bg_b.png")top center no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
}

#pagetitle .box {
width: 1200px;
margin:0 auto;
padding: 0;
}


#pagetitle h2 {
width: 500px;
color: var(--base-color03);
background: var(--base-gd);
font-size: 36px;
font-weight: 600;
text-align: left;
line-height: 1;
padding:40px 35px;
}

#pagetitle h2 span{
font-size: 24px;
font-weight: 600;
text-align: left;
}

#pagetitle_main {
width: 100%;
min-width: 1200px;
height: 500px;
padding: 0;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
}

#pagetitle_main .box {
width: 1200px;
margin:0 auto;
padding: 0;
}

#pagetitle_main h2 {
width: 600px;
color: var(--base-color03);
background: var(--base-gd);
font-size: 36px;
font-weight: 600;
text-align: left;
line-height: 1;
padding:40px 35px;
}

#pagetitle_main h2 span{
font-size: 24px;
font-weight: 600;
text-align: left;
}


@media screen and (max-width: 900px) {
#pagetitle {
padding:120px 0 40px 0;
height: auto;
margin: 56px auto 0;
}

#pagetitle .box {
width:100%;
margin: 0 auto;
padding: 0;
}

#pagetitle h2 {
width: 80%;
margin: 0;
font-size: 20px;
text-align: left;
line-height: 1;
padding:15px 20px;
}

#pagetitle h2 span{
font-size:16px;

}

#pagetitle_img {
position: relative;
width: 100%;
height: 40vh;
overflow: hidden;
}



#pagetitle_main{
padding:120px 0 40px 0;
height: auto;
min-width: 100%;
}

#pagetitle_main .box {
width:100%;
margin: 0 auto;
padding: 0;
}

#pagetitle_main h2 {
width: 80%;
margin: 0;
font-size: 20px;
text-align: left;
line-height: 1;
padding:15px 20px;
}

#pagetitle_main h2 span{
font-size:16px;

}

#pagetitle_main_img {
position: relative;
width: 100%;
height: 40vh;
overflow: hidden;
}

}

#sec_bg {

}

#pan {
margin: 0 auto;
padding:40px 0 0 0;
width: 1200px;
font-size: 16px;
color: #666666;
}


@media screen and (max-width:900px){
#pan {
margin: 0 auto;
padding:20px 0 0 0;
width: 90%;
font-size: 14px;
}

#pan a{
font-size: 14px;
}

}

/***************************************
--------------- HEADLINE ---------------
***************************************/


@media screen and (max-width:768px){
h2 {
font-size: min(4.3vw, 1.8rem);
}
}



/***************************************
-------------- PAGENATION --------------
***************************************/

#pagination {
    width: min(100%,500px);
    margin: 0 auto 0;
}
#pagination ul {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
	margin: 40px auto 0;
}
#pagination li {
    width: 8%;
    line-height: 1.5;
}
#pagination li:not(:last-of-type) {
    margin-right: 2%;
}
#pagination li a {
    display: flex;
    font-size: calc(1.8rem * 0.8);
    color: var(--base-color01);
    border: 1px solid var(--base-color01);
    width: 100%;
    height: 42px;
    align-items: center;
    justify-content: center;
}
#pagination li.active a {
    background: var(--base-color01);
    color: var(--base-color03);
}
@media screen and (max-width: 900px) {
#pagination {
    width:100%;
    margin: 0 auto 40px;
}
}
/***************************************
---------------- FOOTER ----------------
***************************************/


footer {
padding:0 0;
width:100%;
margin: 0 auto;
}

footer .title_a h3{
color: var(--base-color03);
}

footer .title_a span{font-size: 14px;color: var(--base-color03);}

footer .footer_contact{
color: var(--base-color03);
background: url("../img/footer_bg.png")top center no-repeat;
background-size:cover;
width: 100%;
min-width: 1200px;
padding:0
}


footer .footer_box{
margin: 0 auto;
width: 1200px;
text-align: center;
padding: 40px 0;
border-bottom: 2px solid var(--base-color03);
}

footer .h3_title_a{color: var(--base-color03);text-align: center;}
footer .h3_title_a span{color: var(--base-color03);text-align: center;}


footer .row{
margin: 30px auto;
}

footer .col{
border-right:2px solid var(--base-color03);
margin: 0 auto;
text-align: center;
padding: 0 0 0 0;
}

footer .col:nth-child(2n){
border-right:0 solid var(--base-color03);
}

footer p{
font-size: 18px;
font-weight:600;
}

footer .col_img{
padding: 50px 0 50px 0;
}

footer .box_bottom{
background-color: var(--base-color03);
}

footer .box{
padding: 50px 0 30px 0;
}

footer .box_bottom .col{
text-align: left;
}

footer .box_bottom .col img{
padding: 0 0 30px 0;
}

footer .box_bottom p{
font-size: 16px;
font-weight:400;
}

footer dl{
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
}

footer dd{
width: 30%;
}

footer dd:first-child{width: 14%;}
footer dd:nth-child(2){width: 34%;}
footer dd:nth-child(3){width: 28%;}
footer dd:nth-child(4){width: 24%;}

footer dd a{
font-size: 14px;
line-height: 3;
}

.copyright {
width: 100%;
min-width: 1200px;
padding:20px 0;
text-align: center;
color: var(--base-color03);
background: var(--base-gd);
font-size: 12px;
}


#page_top a {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: 60px;
    color: var(--base-color03);
    text-align: center;
    background: var(--base-color02);
    width: 60px;
    height: 60px;
    border-radius: 8px;
    box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 20%);
	z-index: 9999;
}
#page_top a::before {
    content: "";
    width: 1px;
    height: 1px;
    border-right: 10px solid transparent;
    border-bottom: 10px solid var(--base-color03);
    border-left: 10px solid transparent; 
    margin-bottom: 5px;
}
#page_top a span {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.0;
}



@media screen and (max-width: 900px) {
footer {
padding:0 0;
width:100%;
margin: 0 auto;
}

footer .title_a h3{
color: var(--base-color03);
}

footer .title_a span{font-size: 14px;color: var(--base-color03);}

footer .footer_contact{
color: var(--base-color03);
background: url("../img/footer_bg_sp.png")top right no-repeat;
background-size:cover;
width: 100%;
min-width: 100%;
padding:0;
}


footer .footer_box{
margin: 0 auto;
width:100%;
text-align:left;
padding: 20px 0;
border-bottom: 1px solid var(--base-color03);
}

footer .h3_title_a{color: var(--base-color03);text-align: center;}
footer .h3_title_a span{color: var(--base-color03);text-align: center;}


footer .row{
margin: 0 auto;
}

footer .col{
border-right:0 solid var(--base-color03);
border-bottom:1px solid var(--base-color03);
margin: 0 auto;
text-align: center;
padding: 0 0 20px 0;
}

footer .col:nth-child(2n){
border-right:0 solid var(--base-color03);
border-bottom: 0;
padding: 0 0 0 0;
}



footer p{
font-size: 18px;
font-weight:600;
}

footer .col_img{
padding: 40px 0 40px 0;
}

footer .box_bottom{
background-color: var(--base-color03);
}

footer .box{
padding: 40px 0 40px 0;
}

footer .box_bottom .col{
text-align: center;
}

footer .box_bottom .col img{
padding: 0 0 10px 0;
margin: 0 auto;
}

footer .box_bottom p{
font-size: 16px;
font-weight:400;
line-height: 1.6;
}


footer dl{
margin: 0 auto 20px;
width: 95%;
}
footer dd{
width: 50%;
text-align: left;
}

footer dd:first-child{width: 50%;}
footer dd:nth-child(2){width: 50%;}
footer dd:nth-child(3){width: 50%;}
footer dd:nth-child(4){width: 50%;}

footer dd a {
font-size: 14px;
line-height: 3;
}

.copyright {
font-size: 14px;
padding:10px 0;
min-width: 100%;
}




#page_top a::before {
    content: "";
    width: 1px;
    height: 1px;
    border-right: 10px solid transparent;
    border-bottom: 10px solid var(--base-color03);
    border-left: 10px solid transparent; 
    margin-bottom: 5px;
}
#page_top a span {
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1.0;
}

}




.map {
    position: relative;
    width: 100%;
    padding-top:30%;
    /* 16:9のアスペクト比 */
    height: 0;
}

.map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.map_bg{
  height: 100vh;
  filter: grayscale(100%) invert(92%) contrast(83%);
}


@media screen and (max-width: 900px) {

.map {
    position: relative;
    width: 100%;
    padding-top:50%;
    /* 16:9のアスペクト比 */
    height: 0;
	margin: 30px auto 0;

}

.map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
}



.fixed-banner {
  position: fixed;
  top:75%;
  right: 15px;
  transform: translateY(-50%);
  z-index: 1000;
  border-radius: 5px;
  padding:20px 10px 10px 10px;
  text-decoration: none;
  font-weight: bold;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  transition: color 0.3s ease;
  color: var(--base-color03);
  background: var(--base-gd);
  text-align: center;

}

.fixed-banner:hover {
color: #fafbea;
}
.fixed-banner img {padding: 0 0 0 0;font-size: 16px;max-width: 100%;}
.fixed-banner span {padding: 3px 0 0 0;font-size: 12px;}
.fixed-banner p { font-size:14px;line-height: 1.4;}



.close-btn {
  position: absolute;
  top: 2px;
  right: 3px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  line-height: 1;
}

.close-btn:hover {
  color: #ffdede;
}


@media screen and (max-width: 900px) {
.fixed-banner {
display: none;
}
}

/***************************************
------------- 2階層目　お問い合わせ枠 -------------
***************************************/
#sec_inq{
width: 920px;
background-color: #f2f2f2;
margin: 110px auto 0;
}

#sec_inq .row{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
padding: 50px;
}

#sec_inq .col_img{width: 28%;}
#sec_inq .col_img img{
width: 230px;
height: 230px; 
border-radius: 50%;
object-fit: cover;
overflow: hidden;

}


#sec_inq .col_txt{
width: 72%;
padding: 0 0 0 40px;
}

#sec_inq .col_txt p{
font-size: 18px;
line-height: 1.6;
}

#sec_inq h3 {
line-height: 1;
font-size: 37px;
font-weight:600;
color: var(--base-color01);
padding: 0 0 30px 0;
}


#sec_inq .col_txt dl{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
margin: 30px auto 0;
}

#sec_inq .col_txt dd{
width: 50%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items:center;
color: var(--base-color01);
}

#sec_inq .col_txt dd img{
padding: 0 5px 0 0;
}

#sec_inq .col_txt p{font-size: 16px;}
#sec_inq .col_txt dd span{
font-size: 18px;
font-weight: 600;
}

#sec_inq .link_a{
width: 100%;
border-radius: 10px;
}

@media screen and (max-width: 900px) {
#sec_inq{
width: 90%;
margin: 0 auto 0;
}

#sec_inq .row{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
padding:30px 20px;
}

#sec_inq .col_img{
width: 100%;
margin: 0 auto 20px;
text-align: center;
}
#sec_inq .col_img img{
width: 230px;
height: 230px; 
border-radius: 50%;
object-fit: cover;
overflow: hidden;

}


#sec_inq .col_txt{
width: 100%;
padding:0;
}

#sec_inq .col_txt p{
font-size: 18px;
line-height: 1.6;
}

#sec_inq h3 {
font-size:26px;
padding: 0 0 30px 0;
text-align: center;
}


#sec_inq .col_txt dl{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-start;
margin: 30px auto 0;
}

#sec_inq .col_txt dd{
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items:center;
color: var(--base-color01);
}

#sec_inq .col_txt dd img{
padding: 0 5px 0 0;
}

#sec_inq .col_txt p{font-size: 16px;}
#sec_inq .col_txt dd span{
font-size: 18px;
font-weight: 600;
}

#sec_inq .link_a{
width: 100%;
border-radius: 10px;
margin: 20px auto 0;
}

}