/** font **/

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+2:wght@700&display=swap');

:root{
    --font-jp: 'M PLUS 2', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
    --font-en: 'M PLUS 2', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
}
body, .font_sans-serif, .font_serif{
    font-family: var(--font-jp)!important;
}
.font_en, a[href^="tel:"]{
    font-family: var(--font-en);
}

.font_bold{
    font-weight: normal;
}

/** color **/

:root{
    --color1: #ef9659;
    --color1s: #e5793e;
    --color2: #f7f2eb;
    --color3: #9bd15d;
    --color3s: #85c138;
    --color4: #e8e1d9;
    --black: #514222;
    --base: #fcf9f5
}

body, .more a::after, .cate_list li a::after, #page10 ul li a .title::after, #tel_contact > div > .d_inline_b > div p span{
    background-color: var(--base);
}

/** other **/

html, body, .font_14, .font_14_sp, .font_14_tb{
    font-size: 20px;
}

.normal_img img, .square_img, .rectangle_img{
    border-radius: 10px;
}

h2, h3, h4, h5, h6{
    line-height: 1.5;
}

.txt_white{
    text-shadow: 0 2px 2px rgba(0,0,0,0.2);
}

#wrap{
    overflow: hidden;
    background-image: url(./Dup/img/bg_img1.png);
    background-repeat: no-repeat;
    background-size: 600px;
    background-position: top -300px right -100px;
}

h1 img{
    max-width: 200px!important;
}

header{
    box-shadow: none;
}
header nav{
    background-color: transparent!important;
}
.pc_sc_nav{
    background-color: #fff!important;
}
header nav ul, .pc_sc_nav ul{
    justify-content: space-between;
}
header nav li, .pc_sc_nav li{
    width: 16.6666%!important;
}
header nav li a span.txt_color_nomal{
    font-family: var(--font-en);
}
header nav li .border_do4-r, .pc_sc_nav li .border_do4-r{
    border-right: solid 1px var(--color4);
}
header nav li .border_do4-l, .pc_sc_nav li .border_do4-l{
    border-left: solid 1px var(--color4);
}
header nav li a, .pc_sc_nav li a{
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 30px;
    padding: 40px 0 0!important;
}
header nav li:nth-of-type(1) a, .pc_sc_nav li:nth-of-type(1) a{
    background-image: url('./Dup/img/icon1.png');
}
header nav li:nth-of-type(2) a, .pc_sc_nav li:nth-of-type(2) a{
    background-image: url('./Dup/img/icon2.png');
}
header nav li:nth-of-type(3) a, .pc_sc_nav li:nth-of-type(3) a{
    background-image: url('./Dup/img/icon3.png');
}
header nav li:nth-of-type(4) a, .pc_sc_nav li:nth-of-type(4) a{
    background-image: url('./Dup/img/icon4.png');
}
header nav li:nth-of-type(5) a, .pc_sc_nav li:nth-of-type(5) a{
    background-image: url('./Dup/img/icon5.png');
}
header nav li:nth-of-type(6) a, .pc_sc_nav li:nth-of-type(6) a{
    background-image: url('./Dup/img/icon6.png');
}
header nav li a span, .pc_sc_nav li a span{
    color: var(--black);
}

#main_img_wrap .catch{
    width: 30%;
    height: 100%;
    top: 0;
    left: 0;
}
#main_img_wrap .catch::before{
    position: absolute;
    content: "";
    background-image: url(./Dup/img/bg_img2.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 600px;
    height: 600px;
    left: 40%;
    top: 60%;
    transform: translate(-50%, -50%);
    z-index: -1;
}
#main_img{
    border-radius: 20px;
    margin-left: auto;
    width: 70%;
    height: 600px;
    box-sizing: border-box;
}
#main_img::before{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-image: url(./Dup/img/bg_img3.png), url(./Dup/img/bg_img3.png);
    background-repeat: no-repeat;
    background-size: 200px, 400px;
    background-position: top -60px right -70px, bottom -150px left -120px;
    z-index: 1;
}

.intro_img{
    margin-bottom: -50px;
    position: relative;
    z-index: 1;
}
#intro h3{
    font-size: 30px;
    margin-bottom: 0;
}

#contents1 > div.d_flex{
    width: 90%;
    margin: 0 auto -50px;
}
#contents1 #contents1_txt{
    padding-top: 100px;
    background-image: url(./Dup/img/bg_img2.png);
    background-repeat: no-repeat;
    background-size: 600px;
    background-position: bottom -300px right -100px;
}
#contents1 h3, #contents2 h3{
    font-size: 30px;
}

#contents2{
    background-image: url(./Dup/img/bg_img2.png);
    background-repeat: no-repeat;
    background-size: 600px;
    background-position: top -200px left -150px;
}

#top_cms .top_cms_title h3{
    color: var(--black);
    font-size: 40px;
}
#top_cms > .top_cms_box > .cms_wrap{
    background-color: transparent;
    padding: 0;
}

.cate_title{
	background-color: transparent;
	padding: 0;
	margin: 0;
	display: block;
	border: none;
	width: 100%!important;
	font-size: 28px;
	text-align: left;
	padding-bottom: 10px!important;
	margin-bottom: 50px;
	border-bottom: solid 2px;
	color: var(--black);
	font-weight: normal;
	text-shadow: none!important;
}

#page_title{
    z-index: inherit;
}
#page_title p{
    font-family: var(--font-en);
}


/** tablet 780 **/
@media screen and (max-width: 768px){
#main_img {
    height: 400px;
}
}

/** mobile 750 **/
@media screen and (max-width: 667px){
.menu_bt.active > div span:nth-child(4) {
    transform: translate(0px,-6px) rotate(-45deg);
}
html, body, .font_14, .font_14_sp, .font_14_tb{
    font-size: 18px;
}
#wrap {
    background-size: 100vw;
    background-position: top -40vw right -30vw;
}
h1 img{
    max-width: 150px!important;
}
#main_img_wrap .catch{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    height: auto;
}
#main_img{
    width: 100%;
    height: 60vw;
}
#main_img::before {
    background-size: 30vw, 50vw;
    background-position: top -10vw right -8vw, bottom -20vw left -14vw;
}
#main_img_wrap .catch::before {
    width: 500px;
    height: 500px;
    left: 50%;
    top: 60%;
}
#intro h3, #contents1 h3, #contents2 h3{
    font-size: 24px;
}
#contents1 #contents1_txt{
    background-size: 100vw;
    background-position: bottom -40vw right -30vw;
    padding-top: 50px;
}
#contents2{
    background-size: 100vw;
    background-position: bottom -40vw right -30vw;
}
#top_cms .top_cms_title h3{
    font-size: 30px;
}
.cate_title{
	font-size: 24px;
}
}