﻿@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@300;400;500&display=swap');

body {
    /*font-family: 'Zen Maru Gothic', sans-serif;
    font-weight: 500;*/
    color: var(--normal_color);
}
.fixbnr{display: none;}

/* ======================================================================================
　　color
======================================================================================== */
.linkStyle{color: #9FD79A;transition: opacity .3s;text-decoration: underline;}
.linkStyle:hover{opacity: 0.7}

:root {
    --normal_color: #5a4a37;
    --color1: #9FD79A; /* メインカラー */
    --color2: #ffdc71; /* サブカラー */
    --color3: #fbf8f3; /* アクセントカラー1*/
    --color4: #c9baa9; /* アクセントカラー2*/
}
.txt_color1 {
    color: #80cb7a;
}
.more a.txt_color1 {
	color: #ffc107;
}
.more a::after {
    background-color: #ffc107!important;
}
.cate_box a {color: #f6ba3b;}

.cms_title p, .con_sub_title {
    color: #ffb307;
    opacity: 1;
}
#top_contents1 {
	background-color: #f3fceb;
}

p.nav_sub_title {
    opacity: 1;
    color: #c9b1a6;
}
.font_2dw {
    font-size: -webkit-calc(1rem - 1px);
    font-size: calc(1rem - 1px);
}
.normal_img img, .rectangle_img, .square_img{
	border-radius: 20px;
}
#top_contents3 .con3_no {
    color: #9ad579;
}

/* ======================================================================================
　　all
======================================================================================== */

html {
    font-size: 16px;
}
.font_bold {
    font-weight: 500;
}

#top_contents1, #top_cms{
    position: relative;
}
#top_contents1::before, #top_cms::before{
   content: '';
    position: absolute;
    display: block;
    background-repeat: no-repeat;
}
#top_contents1::before, #top_cms::before {
    width: 100%;
    height: 90px;
    background-image: url(./Dup/img/nami.png);
    background-size: cover;
    left: 0;
    top: 0;
    transform: rotate(180deg);
    z-index: 0;
}

.fixbnr {
    left: 20px;
    right: auto;
    bottom: 16px;
    width: 180px;
    position: fixed;
}

/* ---------- header ---------- */
.con_navbar.is-fixed {
    box-shadow: 0px 2px 18px -2px rgb(0 0 0 / 5%);
}

/* ---------- footer ---------- */



/* ======================================================================================
　　top
======================================================================================== */

/* ---------- main_img ---------- */
#main_img {
    position: relative;
    border-radius: 0;
}
#main_img::before {
    content: '';
    position: absolute;
    display: block;
    background-repeat: no-repeat;
    background-image: url(dup/img/main_img.png);
    width: 104%;
    height: 104.5%;
    top: -2%;
    left: -2%;
    z-index: 2;
    background-size: 100% 100%;
}
.main_txt {
    position: absolute;
    z-index: 2;
    width: 59%;
    max-width: 750px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: drop-shadow(1px 3px 0px rgba(0,0,0,0.1));
}
.catch {
    right: 4%;
    width: 40%;
    max-width: 522px;
    filter: drop-shadow(1px 3px 0px rgba(0,0,0,0.03));
}
    
/* ---------- video ---------- */
#video {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: -1;
    border-radius: 0 24px 24px 0;
}
#video video {
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
}

/* ---------- other ---------- */
.triangle01{display: none}

#top_contents1{
    margin-top: 0;
}
#top_contents1 .con1_img{
	z-index: 1;
	padding-bottom: 20%;
	width: 33.33333%!important;
}
.img-container:before{
	z-index: 2;
}
.con1_txt_wrap{
    width: 77%!important;
    padding-top: 0;
    text-align: center;
    margin: auto;
}
.con1_txt_wrap .con_txt {
    text-align: left;
    padding-top: 10px;
}
ul.emp_txt {
	margin-bottom: 17px;
	margin-top: -21px;
	padding: 7px;
	background-color: #fff;
	border-radius: 15px;
	display: block;
}
ul.emp_txt li {
    position: relative;
    padding-left: 24px;
    margin: 0 5px;
    display: block;
}
ul.emp_txt li::before {
    position: absolute;
	left: 0;
    top: 52%;
    transform: translateY(-50%);
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f058";
    color: #f3a68c;
    font-size: 18px;
}
.con1_txt_wrap ul.emp_txt {
    padding: 7px 7px 12px;
    min-width: 400px;
    display: inline-block;
}
.con1_txt_wrap ul.emp_txt li {
    display: inline-block;
}
.con1_txt_wrap ul.emp_txt li {
    position: relative;
    padding-left: 0;
    margin: 0 5px;
    display: block;
    border-bottom: 3px dotted rgb(239 172 179);
    padding-bottom: 6px;
}
.con1_txt_wrap ul.emp_txt li::before {
    display: none;
}
#top_contents3  ul.emp_txt {
    background-color: #fbf8f3;
}
#top_contents3 .con_before {
    width: 30%;
    height: 23px;
    left: 0;
    bottom: 0;
    background-image: url(../dup/img/bg1.png);
    background-position: left 20px bottom 0;
    background-size: 89px;
    background-repeat: repeat-x;
    background-color: transparent;
}

#top_cms .cms_box:first-of-type{
	padding-top: 150px	
}
#top_contents3 .con_txt {
    padding: 15px;
    background-color: #fbf8f3;
    border-radius: 15px;
}

.attach_bg{
	background: -webkit-linear-gradient(165deg, #ddf9d1 0%, #fffed1 100%);
	background: linear-gradient(165deg, #ddf9d1 0%, #fffed1 100%);
	opacity: 0.2;
}

.cms_title, #top_contents1 .con_title {
    background-image: url(../dup/img/bg2.png);
    background-position: center top;
    background-size: 125px;
    background-repeat: no-repeat;
    padding-top: 48px;
}
.cms1inner .cms_title {
    background: none;
    padding-top: 0;
}
.item1 {
    z-index: 2;
    right: 7%;
    width: 24%;
    max-width: 320px;
    top: -2%;
}
#top_contents1 {
    padding-top: 222px;
}
#top_contents1 .con1_img {
    position: absolute;
    top: 0;
    left: 0;
}
#top_contents3 {
    padding: 0 100px;
}
.con3_wrap2 .width_1280-max, .con3_wrap3 .width_1280-max {
    position: relative;
}
.con3_wrap2 .width_1280-max::before, .con3_wrap3 .width_1280-max::before {
    content: '';
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    z-index: 2;
}
.con3_wrap2 .width_1280-max::before {
    width: 12vw;
    height: 100%;
    max-width: 148px;
    background-image: url(../dup/img/item3.png);
    left: -165px;
    top: calc(100% + -224px);
}
.con3_wrap3 .width_1280-max::before {
   width: 32vw;
    height: 13vw;
    max-width: 379px;
    background-image: url(../dup/img/item2.png);
    right: -117px;
    bottom: -78px;
    z-index: 2;
}


/* ======================================================================================
　　under
======================================================================================== */
#page10 .more a.txt_color1 {
    color: #736057;
}
#page10 .more a::after {
    background-color: #736057!important;
}

.con2_bg {
	/* background: -webkit-linear-gradient(165deg, rgba(243, 166, 140, 1) 0%, rgba(223, 255, 237, 1) 100%); */
	/* background: linear-gradient(165deg, rgba(243, 166, 140, 1) 0%, rgba(223, 255, 237, 1) 100%); */
	opacity: 0.5;
	background-color: #b3b3b3;
}

/* ---------- cms ---------- */
#cms_2-b .cate_box, #cms_3-b .cate_box {
    background-color: #fff;
    border-radius: 20px;
    border: none;
    box-shadow: 8px 8px 9px rgb(0 0 0 / 3%);
}



/* ======================================================================================
　　window size
======================================================================================== */

@media screen and (max-width: 1600px){
.con3_wrap2 .width_1280-max::before {
    width: 7.5vw;
    left: -110px;
}
}
@media screen and (max-width: 1300px){
.con3_wrap2 .width_1280-max::before {
    width: 9.5vw;
    left: -114px;
    height: 25vh;
    top: calc(100% + -155px);
}
#top_contents3 {
    padding: 0 120px;
}
#top_contents1 .con1_img {
    padding-bottom: 23%;
}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.mainwrap-r h1 {
    width: 183px;
}
.head_tel {
    display: block;
    margin-top: 0;
    margin-bottom: 10px;
    position: absolute;
    top: 10px;
    left: 54%;
    transform: translateX(-50%);
    width: 37%!important;
}
.main_txt {
    width: 69%;
    top: 47%;
    left: 50%;
}
.catch {
    bottom: 65px;
    right: 50%;
    width: 59%;
    transform: translateX(50%);
}
#top_contents1 .con1_img {
    padding-bottom: 35%;
    width: 51.33333%!important;
}
.item1 {
    z-index: 2;
    right: 6%;
    width: 34%;
    max-width: 320px;
    top: 2%;
}
#top_contents1 {
    margin-top: -150px;
}
.con1_txt_wrap {
    width: 100%!important;
    padding-top: 50px;
}
#top_contents1 ul.emp_txt {
    margin-bottom: 17px;
}
top_contents1 ul.emp_txt li::before {
    top: -3px;
}
#top_contents1 ul.emp_txt li {
    width: 100%;
}
#top_contents3 {
    padding: 0 60px;
}
.con3_txt_wrap p {
    padding-bottom: 60px;
}
.con3_wrap2 .width_1280-max::before {
    width: 13.5vw;
    left: auto;
    height: 18vh;
    top: calc(100% + -76px);
    right: -27px;
    transform: rotate(13deg);
}
.con3_wrap3 .width_1280-max::before {
    width: 36vw;
    height: 20vw;
    right: -94px;
    bottom: -90px;
    z-index: 2;
}

.cms_title, .attach_txt {
    background-size: 98px;
	padding-top: 43px;
}
.info_txt_wrap {
	background: transparent;
}
.fixbnr {
    width: 131px;
}
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){
.mainwrap-r h1 {
    width: 124px;
    padding-top: 0;
}
.head_tel {
    margin-top: 15px;
    margin-bottom: 0px;
    position: static;
    transform: none;
    width: 100%!important;
	padding-top: 15px;
    padding-bottom: 3px;
}
.head_tel p {
	line-height: 1;
}
.main_txt {
    width: 83%;
    top: 51%;
    left: 50%;
}
.catch {
    bottom: -56px;
    width: 83%;
}
#main_img {
    height: 100vw;
}
#top_contents1 ul.emp_txt {
    padding: 7px 14px;
}
#top_contents1 ul.emp_txt li {
    width: 41%;
    margin: 0;
    padding-left: 24px;
}
#top_contents1 .con1_img2 div {
    padding-bottom: 79%;
    min-width: 100%;
}
#top_contents1 .con1_img {
    padding-bottom: 62%;
    width: 91.66667%!important;
}
.item1 {
    right: 50%;
    width: 46%;
    top: 19%;
    transform: translateX(50%);
}
#top_contents1 .con_title {
    background-image: none;
    padding-top: 121px;
}
#top_contents1 ul.emp_txt li {
    width: 100%;
    padding-left: 0;
}
#top_contents1 ul.emp_txt {
    padding: 15px 19px;
    box-sizing: border-box;
    min-width: 100%;
}
.con1_txt_wrap .con_txt {
    padding-top: 0;
}
#top_contents3 {
    padding: 0 20px;
}
#top_contents3 .con_before {
    width: 128px;
}
#top_contents3 .letter_3 {
    letter-spacing: 1px;
    font-size: 18px;
}
.con3_txt_wrap p {
    padding-bottom: 0;
}
.con3_wrap2 .width_1280-max::before {
    width: 21.5vw;
    height: 19vh;
    top: calc(100% + -56px);
    right: -5px;
    transform: rotate(13deg);
    z-index: 2;
}
.con3_wrap3 .width_1280-max::before {
    width: 43vw;
    height: 29vw;
    right: -5px;
    bottom: -90px;
}
#top_contents1::before, #top_cms::before {
    height: 24px;
    background-size: 100%;
}
#copylight {font-size: 12px}
.hambuger_text, .hambuger_text02 {
    color: #5c5c5c;
}
}







