﻿@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500&display=swap');
@font-face {
font-family: "komorebi";
  src: url("./Dup/img/komorebi.eot") format("eot"),url("./Dup/img/komorebi.woff") format("woff"),url("./Dup/img/komorebi.woff2") format("woff2");
}
  
:root{--font_komorebi: "komorebi", 'Zen Kaku Gothic New', "Yu Gothic Medium", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, "MS PGothic", sans-serif;}
:root{--font_zenmaru: 'Zen Maru Gothic', "Yu Gothic Medium", YuGothic, "Hiragino Kaku Gothic ProN", Meiryo, "MS PGothic", sans-serif;}


body, .font_sans-serif, .font_Quick, .link_type1 .link_top .link_title {
    font-family: var(--font_zenmaru) !important;
}



/* ---------- color ---------- */

.linkStyle{color: #493a2f;transition: opacity .3s;text-decoration: underline;}
.linkStyle:hover{opacity: 0.7}

:root {
    --normal_color: #5a4433;
    --color1: #93d05d; /* メインカラー */
    --color2: #e6e6e6; /* サブカラー */
    --color3: #f2903c; /* アクセントカラー1*/
    --color4: #fbf8f1; /* アクセントカラー2*/
    --color5: #d5f2d0;
}
body, .top_nav ul li a, .top_nav ul li {
	color: var(--normal_color);
}
.img-container:before, #contents .box figure:after, #loading_line .line, .t_cms_img2 .img-container:before, #top_cms {
    background: var(--color5);
}
footer {
    background-color: var(--color3);
}
main{background-color: var(--color4);}


/* ======================================================================================
　　all
======================================================================================== */

.other .box{
    background: url(dup/img/bg1.jpg);
    background-size: cover;
}
#wrap {
    width: 100%;
    margin: auto;
    margin-top: 0;
}

.img-container, .img-container:before, .con3_inner, .cms_2-b .box_img1 {
    border-radius: 20px;
}

/* ---------- header ---------- */
#header {
    padding: 0;
}
.top_page header {
    width: 97%;
    padding-top: 20px;
}
.menu {
    box-shadow: 0px 2px 10px rgba(0,0,0,0.05);
}

/* ---------- footer ---------- */
#footer {opacity: 0;}
#footer.scroll {opacity: 1;}


/* ======================================================================================
　　top
======================================================================================== */

.main_logo {
    position: absolute;
    top: 16px;
    left: 34px;
    width: 36%;
    max-width: 250px;
}
.logo_box {
    z-index: 2;
    top: 0;
    left: 0;
}
.main_txt {
    z-index: 2;
    top: 301px;
    left: 29px;
    width: 30%;
    max-width: 500px;
}
.item2 {
    z-index: 0;
    top: 58vh;
    left: -50px;
}
.main_img_wrap {
    height: calc(100vh - 142px);
    width: 79%;
    top: 65px;
    right: 46px;
    border-radius: 34px;
    background-color: transparent;
}
.vegas-overlay {opacity: 0!important;}
.vegas-slide, .vegas-slide-inner {
    border-radius: 39px;
}


.main_img_wrap .navi,.vegas-timer, footer .svg_box {display: none;}



.intro {
    background-image: url(../Dup/img/bg2.jpg);
    background-position: bottom;
    background-size: cover;
    background-attachment: fixed;
    width: 100%!important;
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
}
.intro p {
    width: 90%;
    max-width: 1280px;
    margin: 0 auto 5px;
}
.intro p.sub {
    margin: auto;
    background-image: url(../dup/img/bg2.png);
    background-position: center top;
    background-size: 119px;
    background-repeat: no-repeat;
    padding-top: 55px;
}
#contents {
    position: relative;
}
#contents::after {
    position: absolute;
    content: "";
    left: 0;
    top: 25%;
    width: 100%;
    height: 148px;
    background: transparent;
    background-image: url(./dup/img/loop_txt.png);
    background-size: 800px;
    background-position-y: 0;
    background-position-x: 0;
    background-repeat: repeat-x;
    animation: loop 30s linear infinite;
    z-index: 0;
    opacity: 1;
}
@keyframes loop {
	0% {background-position-x: 0;}
	100% {background-position-x: -1600px;}
}
@keyframes loop {
	0% {background-position-x: 0;}
	100% {background-position-x: -1600px;}
}
#contents .box_wrap {position: relative;z-index:2;}

#contents .box figure:after {border-radius: 20px 0 0 20px;}
#contents .box.no2 figure:after {border-radius: 0 20px 20px 0;}

#svg_box {position: relative;}
#dec1 {
    width: 22%;
    margin-left: 17.5%;
    margin-top: -57px;
}
#dec2 {
    width: 14%;
    margin-top: -109px;
    margin-left: 43.5%;
}
#dec3 {
    width: 11%;
    margin-left: 64.5%;
    margin-top: 0;
    position: absolute;
    top: 72px;
}

#con3 {
    width: 90%;
}
.con3_inner {
    position: relative;
    padding: 20px;
    padding-top: 55px;
    font-size: 17px;
}
.con3_inner h3 {
    position: absolute;
    top: -69px;
    left: 0;
    right: 0;
    margin: auto;
    background-image: url(../dup/img/bg2.png);
    background-position: center top;
    background-size: 119px;
    background-repeat: no-repeat;
    padding-top: 55px;
}
.item6 {
    z-index: 0;
    right: -148px;
    top: -64px;
    width: 30%;
}

/* ======================================================================================
　　under
======================================================================================== */








/* ======================================================================================
　　window size
======================================================================================== */

/* ---------- tablet ---------- */
@media screen and (max-width: 768px){
.main_img_wrap {
    height: 500px;
}
.main_txt {
    top: 397px;
    left: 18px;
    width: 35%;
}
.main_logo {display: none;}
header .logo {
    width: 20%;
    left: 19px;
}
.item1 {width: 65%;}
.item2 {
    top: 43vh;
    left: auto;
    width: 46%;
    right: -16px;
}

.main_wrap {
    padding-top: 0;
    margin-top: 653px;
}
.svg_box {
    margin-bottom: 100px;
}
#dec1 {
    margin-top: -6px;
    width: 38%;
    margin-left: 3.5%;
}
#dec2 {
    width: 22%;
}
#dec3 {
    width: 17%;
    margin-left: 71.5%;
}
}

/* ---------- mobile ---------- */
@media screen and (max-width: 667px){
header .logo {
    width: 32%;
    left: 14px;
}
#nav_menu {
    height: 70px;
    width: 70px;
    right: 0px;
    top: 0;
}
.main_img_wrap {
    height: 300px;
    position: relative;
    right: 0;
    left: 0;
    margin: auto;
}
.main_wrap {
    padding-top: 0;
    margin-top: 122px;
}
.main_txt {
    top: 294px;
    left: 9px;
    width: 56%;
}
.item2 {
    top: 29vh;
    left: auto;
    width: 71%;
    right: -26px;
}

.intro p{
    width: 100%;
}
#contents .box:nth-child(3) figure {
    margin-top: 50px;
    order: 2;
}

.svg_box {
    margin-bottom: 0;
}
#dec1 {
    margin-top: 47px;
    width: 55%;
    margin-left: 0.5%;
}
#dec2 {
    width: 30%;
    margin-top: -12px;
    margin-left: 47.5%;
}
#dec3 {
    width: 26%;
    margin-left: 71.5%;
    top: -9px;
}
#contents::after {background-size: 398px;}

#contents .box:nth-child(even) {display: block;}

#page_title .img-container::after {
    background-color: rgb(147 208 93 / 36%);
}
.img-container, .img-container:before {
    border-radius: 0;
}

.other .posi_center {
    width: 100%;
}
.other .box_title {
    font-size: -webkit-calc(1rem + 9px);
    font-size: calc(1rem + 9px);
}
.other .box:hover figure {
    opacity: 0.3;
}
.other .box:hover p, .other .box:hover h2 span {
    color: var(--normal_color);
}

}

/* fix_bnr ---------------------------------------------------------------------------------------------*/
#fix_bnr {
    bottom: 12px;
    right: 11px;
    z-index: 10;
    width: 34%;
    max-width: 402px;
    transition: 0.5s;
}
#fix_bnr.scroll {
    bottom: 73px;
    width: 30%;
    max-width: 268px;
}
#fix_bnr.close{
    opacity: 0;
    z-index: -1;
}
@media screen and (max-width: 768px){
#fix_bnr {
    width: 36%!important;
}
#fix_bnr.close{
    transform: translateX(200px);
}
}
@media screen and (max-width: 667px){
#fix_bnr {
    width: 64%!important;
    right: 0;
    left: 14px;
    bottom: 10px;
}
#fix_bnr.scroll {
    bottom: 10px;
}
}
/* fix_bnr end ---------------------------------------------------------------------------------------------*/