@import url('https://fonts.googleapis.com/css2?family=Zen+Old+Mincho:wght@400;500&display=swap');


h1, h2, h3, h4, h5, h6, .catch, #topCms .cmstitle p, .pagetitle .title_box p, .pc_nav li .page_title, #sp_nav .sp_nav_inner .l-menu .l-menu_cms,#page10 .sitemap li .sub{
    font-family:"Zen Old Mincho","游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif" !important;
}

nav.pc_nav span.page_title {
    font-weight: 500;
}

#topCms .cmstitle p,.pagetitle .title_box p {
    font-weight: 400;
}

/* font ------------------------------------------------------------------------------*/

/* color -----------------------------------------------------------------------------*/

:root {
    --normal_color: #3c4142;
    --color1: #52a9af; /* メインカラー */
    --color2: #f8d7a1; /* サブカラー */
    --color3: #eb9a17; /* アクセントカラー1*/
    --color4: #f2f5f6; /* アクセントカラー2*/
    --white:#ffffff;
    --black:#000;
    --gray:#ccc;
}

.linkStyle{color: var(--color1);
          border-bottom:solid 1px;
}
body#body {
    background: var(--white);
}

#page_top {
    background: var(--color3);
}
div#bottom_tel a {
    background: #fffcf7;
    color:var(--color3);
}

section#content {
    background: #fdf9f3;
}

/* color -----------------------------------------------------------------------------*/

/* ev --------------------------------------------------------------------------------*/
/* ev --------------------------------------------------------------------------------*/

/*top■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

#main_img::before {
    left: -2%;
    top: 50%;
    transform: translateY(-52%);
    width: 100%;
    height: 100%;
    background-image: url(../dup/img/catch.png) !important;
    background-size: 80%;
    background-position: center !important;
    background-repeat: no-repeat;
    animation: none;
    z-index: 2;
    opacity: 1;
}

#main_img {
    background: linear-gradient(134deg, var(--color1) 0%, rgba(242, 248, 249, 1) 15%, rgba(255, 255, 255, 1) 50%, rgba(253, 247, 237, 1) 88%, var(--color3) 100%);
}


.logo1 {
    max-width: 200px;
}

section#intro p {
    word-break: keep-all;
}

#intro:before {
    background: linear-gradient(136deg, rgb(82 169 175 / 40%) 0%, rgba(70, 75, 75, 0.4) 50%, rgb(235 154 23 / 40%) 100%);
}


/* アニメーション前のスタイル */
.js-marker {
  display: inline;
  position: relative;
  background-image: linear-gradient(90deg, var(--color3), var(--color3)); /* 単色の場合は同じ色、グラデーションさせる場合は別々の色 */
  background-repeat: no-repeat;
  background-position: bottom left;
  background-size: 0 30%; /* '30%'の部分にマーカーの太さを記入 */
  transition: all 1s ease-in-out; /* マーカーを引く速度を調整 */
  font-weight: bold; /* ついでに太字にしたい場合 */
}

/* アニメーション発火時 */
.js-marker.inview {
  background-size: 100% 30%; /* '30%'の部分は上で設定した太さに合わせる */
}

#main_img {
    padding-top: 110px;
}

/*top■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/*all■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

.f_contact_box p {
    color: var(--white);
}

#fakeloader:before {
    background-color: rgba(255, 255, 255, 1);
}


/*all■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/*sub■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/

/*マスター修正*/
.cms_2-g .swiper-button-next {
    left: 35px;
    right: auto;
}

.cms_2-g .swiper-slide {
    height: auto !important;
    opacity: 0 !important;
}

.cms_2-g .swiper-slide-active {
    opacity: 1 !important;
}

/*電話番号バナー　@@@ noimg*/
/*マスター修正*/


.pagetitle {
    margin-top: 105px;
}

#cms_2-g .box_item.box_item_txt {
    padding: 0;
}

h4.modal_title2 {
    font-size: 26px;
    line-height: 1.5;
    font-weight: 500;
    color: var(--color1);
}

/*sub■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/


/*1536*/
@media screen and (max-width: 1536px){

}

/*1530 × 735*/
@media screen and (max-width: 1530px){

}

/*1366*/
@media screen and (max-width: 1366px){

}

/*タブレット*/
@media screen and (max-width: 768px){
div#main_img {
    height: 46vh !important;
}    

#main_img {
    padding-top: 115px;
}

.menu_btn {
    padding: 27px 20px 24px 20px;
}

section#intro p.txt_center {
    word-break: break-word;
    font-size: 19px;
}

section#intro h2 {
    word-break: keep-all;
    text-align: center;
    line-height: 1.3;
    font-size: 35px;
    margin-bottom: 20px;
}

#content .box_title {
    font-size: 20px;
    word-break: keep-all;
}

h4.modal_title2 {
    word-break: keep-all;
}

#sp_nav .sp_nav_inner .menu__header .logo3 img {
    max-width: 250px;
}
.pagetitle {
    margin-top: 90px;
}

.pagetitle .title_box p {
    bottom: 18px;
}

.pagetitle {
    padding-top: 115px;
}

}

/*スマホ*/
@media screen and (max-width: 667px){

.copy {
    padding-bottom: 70px;
    padding-top: 20px;
}

#bottom_tel a, #page_top {
    height: 50px;
}

.pagetitle {
    padding-top: 70px;
}


.menu_btn {
    padding: 17px 12px 20px 12px;
}

.pagetitle {
    margin-top: 70px;
}

.logo1 {
    max-width: 130px;
    margin-top: 0px;
}

#sp_nav .sp_nav_inner .menu__header .logo3 img {
    max-width: 180px;
}

#page8 .copy {
    padding-bottom: 10px;
    padding-top: 10px;
}

#cms_2-g h4.box_title1 {
    line-height: 1.5;
    font-size: 20px;
    word-break: keep-all;
}

#content .box_title {
    font-size: 18px;
    word-break: normal;
    line-height: 1.3;
    padding-top: 10px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

#content .cate_item {
    padding: 30px 10px 40px 25px;
}


#content .swiper-slide .d_flex {
    padding-right: 10px;
}

.modal-box {
    width: 100%;
}
h4.modal_title2 {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: 0px;
    color: var(--color1);
    word-break: normal;
}
.modal-box .inner {
    padding: 5%;
}

.modal-box .modal-close span {
    width: 35px;
    height: 35px;
}

.modal-box:before {
    height: 2%;
}

.modal-box .inner {
    max-height: 600px;
}
p.modal_txt {
    letter-spacing: 0.5px;
    line-height: 1.6;
}

section#intro p.txt_center {
    word-break: normal;
    font-size: 16px;
    line-height: 1.5;
}

div#main_img {
    height: 100svh !important;
}

#main_img {
    padding-top: 70px;
    padding-bottom: 80px;
}
#main_img {
    background: linear-gradient(134deg, var(--color1) -4%, rgba(242, 248, 249, 1) 17%, rgba(255, 255, 255, 1) 50%, rgba(253, 247, 237, 1) 80%, var(--color3) 100%);
}


#main_img::before {
    left: auto;
    top: auto;
    bottom: 0%;
    right: 0%;
    transform: translateY(-0%);
    width: 100%;
    height: 100%;
    background-image: url(../dup/img/catch_sp.png) !important;
    background-size: 97%;
    background-position: right 0% bottom 0% !important;
    background-repeat: no-repeat;
    animation: none;
    z-index: 3;
    opacity: 1;
}

#topCms .cmstitle p {
    font-size: -webkit-calc(1rem + 30px);
    font-size: calc(1rem + 30px);
    bottom: 10px;
}

.cmstitle h3 {
    padding: 25px 0 0 0;
}

#content .swiper-button-next {
    width: 100px;
    top: 280px;
    line-height: 1.2;
    background: var(--color3);
    padding: 10px;
    color: var(--white);
    border-radius: 50px 0px 0px 50px;
}

}