﻿@import url('https://fonts.googleapis.com/css2?family=Kosugi+Maru&display=swap');
#main_img h2 {
	top: 33%;
    left: 50%;
    width: 85%;
	text-align: left;
    font-size: 40px;
}
.chatting h3 {
position: relative;
display: inline-block;
margin: 10px 20px;
padding: 10px 20px 10px 52px;
background: #fffbe2; 
text-align: left;
border-radius: 12px;
}
.chatting p {
position: relative;
display: inline-block;
margin: 10px 20px;
padding: 10px 20px 10px 52px;
background: #ffddc2; 
text-align: left;
border-radius: 12px;
}
/* 吹き出しの三角部分の作成 */
.chatting h3::after {
content: "";
border: 15px solid transparent;
border-top-color: #fffbe2; 
position: absolute;
top: 10px; 
}
.chatting p::after {
content: "";
border: 15px solid transparent;
border-top-color: #ffddc2; 
position: absolute;
top: 10px; 
}
.chatting.left {
	padding: 15px 0 15px 51px;
	background: url(Dup/img/q1.png) no-repeat;
	background-size: auto 80px;
}
.cate_box:nth-child(odd) .chatting.left {
	background: url(Dup/img/q2.png) no-repeat;
	background-size: auto 80px;
} 
.chatting.right {
	padding: 15px 74px 15px 0px;
	background: url(Dup/img/a1.png) no-repeat 100% 10px;
	background-size: auto 80px;
	text-align: right;
}
.cate_box:nth-child(2n) .chatting.right {
	background: url(Dup/img/a2.png) no-repeat 100% 10px;
	background-size: auto 80px;
}
.cate_box:nth-child(3n) .chatting.right {
	background: url(Dup/img/a3.png) no-repeat 100% 10px;
	background-size: auto 80px;
}
.chatting.left h3::after {
left: -15px; 
}
.chatting.right p::after {
right: -15px; 
}
#cms_5-c .box_txt1::before {
/*content: "A.";*/
    color: #5a5a5a;
}



.fadein{
     opacity: 0;
     transform: translateY(20px);
     transition: 1.5s;
     transition-property: opacity,transform
}
.fadein.fadetrans{
     opacity: 1;
     transform: none
}
.fadeCatch{
     opacity: 0;
     transform: translateY(20px);
     transition: 1.5s;
     transition-property: opacity,transform
}
.fade2{
     opacity: 0;
     transform: translateY(30px);
     transition: 1s;
     transition-property: opacity,transform
}
.fade3{
     opacity: 0;
     transform: translateY(30px);
     transition: 1s;
     transition-property: opacity,transform
}
.fadeCatch.fadetrans, .fade2.fadetrans, .fade3.fadetrans{
     opacity: 1;
     transform: none
}
#contents_box figure, #contents_box figure img, .box_item figure img, .cate_wrap figure, .cate_wrap figure img, .box_item figure {
    border-radius: 30px;
}
/*
██╗  ██╗███████╗ █████╗ ██████╗ ███████╗██████╗
██║  ██║██╔════╝██╔══██╗██╔══██╗██╔════╝██╔══██╗
███████║█████╗  ███████║██║  ██║█████╗  ██████╔╝
██╔══██║██╔══╝  ██╔══██║██║  ██║██╔══╝  ██╔══██╗
██║  ██║███████╗██║  ██║██████╔╝███████╗██║  ██║
╚═╝  ╚═╝╚══════╝╚═╝  ╚═╝╚═════╝ ╚══════╝╚═╝  ╚═╝
*/
header #logo {
	padding: 0;
}
#logo img {
    filter: drop-shadow(0px 0px 2px #ffa500) drop-shadow(1px 1px 2px #ffa500) drop-shadow(0px 0px 0px #ffa500);
}
header {
	top: 0!important;
	left:0;
	position: relative;
	z-index: 11;
	background-image: url(Dup/img/momiji.png), url(Dup/img/momiji2.png);
    background-position: right -22px top 95%, -107px -80px;
    background-repeat: no-repeat;
    background-size: 123% auto, 90% auto;
	padding-top: 7%!important;
	background-color: #fff5ee!important;
}
header:after {
    /*content: "";*/
    display: block;
    position: absolute;
    background-image: url(Dup/img/head_nami.png);
    width: 20px;
    height: 100%;
    background-size: 100% 1000px;
    background-repeat: repeat-y;
    top: 0;
    right: -19px;
    z-index: -1;
}
header .contact_bt a span {
    background: url(Dup/img/icon_contact.png);
    background-repeat: no-repeat;
    background-size: 39px;
    background-position: 0 50%;
    top: 50%;
    left: 0;
padding: 50px 27px 50px 51px;
}
header .tel_bt a span {
    background: url(Dup/img/icon_tel.png);
    background-repeat: no-repeat;
    background-size: 39px;
    background-position: 0 50%;
    top: 50%;
    left: 0;
padding: 50px 27px 50px 51px;
}
.head_box {
	padding: 0;
}
#main_menu ul li a::before {
    top: 50%;
    width: 16px;
    background-color: #2c2c2c;
}
#main_menu ul li a:hover::before {
    background-color: #ffa500;
}
body {
font-size: 17px;
letter-spacing: 0;
font-family: yamamotoan-classic-stdn, sans-serif;
font-weight: 400;
font-style: normal;
/*background-color: #fff5ee;
background-image: url("https://www.transparenttextures.com/patterns/groovepaper.png");*/

}
.font_12 {
	font-size: 15px;
}
.font_14 {
	font-size: 17px;
}
#contents1 h2, #contents2 h2, #contents3 h3 {
	font-size: 28px;
	font-weight: bold;
	border-bottom: 3px dotted #ffa500;
	display: inline-block;
/*	font-family: donguri-kana, sans-serif;*/
	font-family: yamamotoan-classic-stdn, sans-serif;
}
.font_en {
    font-family: yamamotoan-classic-stdn, sans-serif;
}
#main_menu ul li a {
    color: #2c2c2c;
    font-size: 19px;
    font-weight: bold;
    margin-bottom: 20px;
    /* font-family: donguri-kana, sans-serif; */
    font-family: yamamotoan-classic-stdn, sans-serif;
}
#main_menu ul li a:hover {
	color: #ffa500;
}
#top_cms .button:before, #top_cms .button:after {
    height: 50px;
}
#video h2 {
	width: 300px;
    position: absolute;
    right: 3%;
    bottom: -2%;
    top: inherit;
    left: inherit;
    transform: inherit;
    filter: drop-shadow(0px 0px 5px rgba(100,200,200, 0.2));
}
/* ------------------- hamburger ---------------------- */
.fat-nav ul {
	background: #ffa500;
}
.fat-nav li {
	margin: 0 20px;
}
.fat-nav li a {
    color: #fff;
}
.fat-nav li + li {
	border-top: 2px dotted #fff;
}
.fat-nav li:last-child a {
	border-radius: 25px;
    background: #ff7127;
    border-color: #fff;
}
/* ----------------------- button --------------------------*/
.button {
    color: #2c2c2c;
    border: 2px solid #ffa500;
    z-index: 0;
    position: relative;
    font-weight: bold;
    font-size: calc(1rem - 1px);
	width: 258px;
	margin: 0 auto;
}
#top_cms .button {
    border: 2px solid #ffa500;
}
#top_cms .button:hover {
	color: #878787;
	transform: translateY(-5px);
}
.button:hover {
	color:#ffa500;
}
.button2 {
	border-radius: 38px;
    color: #2c2c2c;
    border: 3px solid #ffcd72;
	font-weight: bold;
}
.button:hover::after {
    box-shadow: none;
}
.button2:hover {
    box-shadow: none;
	color: #2c2c2c;
	opacity: 0.6;
}
/* ---------------TOPCMS  CMS----------------------- */
#contents_box {
	overflow: hidden;
}
#contents1, #contents2 {
	position: relative;
}
#contents1:after {
    content: "";
    display: block;
    position: absolute;
    bottom: -18px;
    left: 0;
    top: inherit;
    background: url(Dup/img/nami2.png) no-repeat left 0 top 0;
    background-size: 1500px 100%;
    width: 100%;
    height: 19px;
    z-index: 2;
}
#contents2:after {
content: "";
    display: block;
    position: absolute;
    top: -19px;
	height: 20px;
    left: 0;
    background: url(Dup/img/nami2.png) no-repeat left 0 bottom 0;
    background-size: 1500px 100%;
	width: 100%;
    z-index: 2;
    transform: rotate( 
180deg
 );
}


#top_cms .box .cms_title:before {
display: none;	
}
#top_cms .box .cms_title {
    background-image: url(Dup/img/icon_news.png);
    background-size: 64px auto;
    padding-left: 93px;
    background-position: 19px 50%;
    background-repeat: no-repeat;
}
#top_cms .box:nth-child(2) .cms_title {
    background-image: url(Dup/img/icon_about.png);	
}
#top_cms .box:nth-child(3) .cms_title {
    background-image: url(Dup/img/icon_menu.png);	
}
#top_cms .box:nth-child(5) .cms_title {
    background-image: url(Dup/img/icon_faq.png);	
}
#top_cms .cms_title h2{
	font-size: 28px;
}
#top_cms .cms_title p {
	letter-spacing: 0.2rem;
    font-weight: bold;
	padding-left: 5px;
}
#top_cms .box:nth-child(1) {
	background: #fdf5e6;
}

#cms_2-a figure, #cms_6-a .cate figure {
	margin: 0 auto 30px;
}
#cms_2-a .cate_title {
    border-left: 0;
    border-top: 0;
    display: block;
    text-align: center;
    background-color: inherit;
    font-size: 22px;
    font-weight: bold;
    padding-top: .5em;
    padding-bottom: .5em;
    margin-bottom: 2em;
    position: relative;
    border-bottom: solid 3px #f5f5f5;
    color: #484848;
    font-family: 'Shippori Mincho', serif;
}
#cms_2-a .cate_title:after {
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 10px;
    content: '';
    background-image: -webkit-repeating-linear-gradient( 
135deg
 , #ffa500, #ffa500 1px, transparent 2px, transparent 5px);
    background-image: repeating-linear-gradient( 
-45deg
 , #ffa500, #ffa500 1px, transparent 2px, transparent 5px);
    background-size: 7px 7px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
#cms_6-a .cate {
	background-color: #fff;
	padding: 33px;
	border-left:4px dotted rgba(0,0,0,.1);
  border-right:4px dotted rgba(0,0,0,.1);
  box-shadow:0 0 7px rgba(0,0,0,0.11);
}
#cms_6-a .cate {
  position: relative;
  background: #F8F0D7;
  border-left:4px dotted rgba(0,0,0,.1);
  border-right:4px dotted rgba(0,0,0,.1);
  box-shadow:0 0 5px rgba(0,0,0,.2);
  padding: 1em;
  color: #65513f;
}
#cms_6-a .cate .masking-tape{
  position: absolute;
  top: -1em;
  left: 0;
right: 0;
margin: auto;
  width:100px;
  height:30px;
  background-image: linear-gradient(-45deg, rgba(227,155,140,.4) 25%, transparent 25%, transparent 50%, rgba(227,155,140,.4) 50%, rgba(227,155,140,.4) 75%, transparent 75%, transparent 100%);
  background-size: 20px 20px;
  border-left:2px dotted rgba(0,0,0,.1);
  border-right:2px dotted rgba(0,0,0,.1);
  box-shadow:0 0 5px rgba(0,0,0,.2);
  padding: 0.25em 2em;
  color: #65513f;
  transform: rotate(-4deg); 
}
/* ------------- FOOTER -------------------*/
.footer_wrap {
/*background-color: #ffa500;*/
position: relative;
}
.footer_wrap:after {
    /*content: "";*/
    display: block;
    position: absolute;
    background-image: url(Dup/img/head_nami_tb.png);
    width: 100%;
    height: 23px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    top: -22px;
    right: auto;
    left: 0;
    transform: rotate( 
180deg
 );
}
.footer_cms {
	color: #2c2c2c;
}
#map .ggmap {
    box-shadow: 0 1px 20px 0 rgba(115, 146, 183, 0.11);
}
/* ------------------------------------- */
article {
	position: relative;z-index: 10;
}
#main_menu ul {
	margin-bottom: 23px;
	padding: 0 20px;
}
.link_box ul {
    justify-content: center;
}
.link_box ul li {
    width: 30px!important;
    margin-left: 10px;
    margin-right: 10px;
}
.fat-nav li {
    font-size: 16px;
}
.foot_tel_bt {
	z-index: 10;/*要る*/
}
.foot_tel_bt a {
	border-color: #ffa500;
	color: #2c2c2c;
	z-index: 10;/*要る*/
}
#page_title .txt_shadow-b {
	text-shadow: none;
}
#page_title h2, #page_title p {
	color: #2c2c2c;
	z-index: 10;
	position: relative;
	text-align: center;
}
#page_title p {
	letter-spacing: 0.1rem;
	color: #ffa500;
}
#page_title .page_box::before {
	content: "";
    display: block;
    position: absolute;
    top: 60px;
    left: 0;
    height: 400px;
    width: 400px;
    background: url(Dup/img/page_title.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0 0;
    z-index: 0;
    right: 0;
    margin: auto;
}
#page_title .page_box::after {
	content: "";
    display: block;
    position: absolute;
    top: -93px;
    left: 0;
    height: 102px;
    width: 67px;
    background-image: url(Dup/img/png1.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 0 0;
    z-index: 0;
    right: 0;
    margin: auto;
}
#page03 #page_title .page_box::after {
    background-image: url(Dup/img/png2.png);
	left: -9px;
}
#page04 #page_title .page_box::after {
    background-image: url(Dup/img/png3.png);
	height: 84px;
    width: 43px;
}
#page05 #page_title .page_box::after {
    background-image: url(Dup/img/png4.png);
}
#page06 #page_title .page_box::after {
    background-image: url(Dup/img/png5.png);
	height: 90px;
    width: 75px;
}
#page_title .page_box {
	position: relative;
	padding-left: 0;
	margin-left: 0;
	padding-right: 0;
}
@media screen and (min-width:667px) and ( max-width:768px) {
	.fat-nav li {
		padding: 25px;
	}

}
@media(max-width: 768px) {
	#main_img h2 {
    top: 14%;
    left: 55%;
    width: 300px;
    transform: inherit;
}
header:after {
    background-image: url(Dup/img/head_nami_tb.png);
    width: 100%;
    height: 38px;
    background-size: 800px 100%;
    background-repeat: repeat-x;
    top: auto;
    bottom: -37px;
    right: auto;
    left: 0;
}
header {
padding: 14px 0 0px!important;
    top: 0!important;
    left: 0;
    position: relative;
    z-index: 11;
    background-image: url(Dup/img/momiji2.png);
    background-position: -16px -68px;
    background-repeat: no-repeat;
    background-size: 27% auto;
}
#video h2 {
    width: 232px;
}
	.cms_1-e .cate_box {
    padding: 19px;
}
	header {
		z-index: 50;
	}
.modal_box {
    max-height: 82%;
    margin-top: 23px;
}
}
@media(max-width: 667px) {
#main_img h2 {
    top: 10%;
    left: 41%;
    width: 204px;
    font-size: 19px;
}
header {
		    padding: 13px 0px 2px;
	}
header:after {
    height: 19px;
    bottom: -15px;
}
#top_cms .cms_title h2 {
    font-size: 20px;
}
#top_cms .box .cms_title {
    background-size: 49px auto;
    padding-left: 79px;
    background-position: 6px 50%;
    background-repeat: no-repeat;
}
.cate_title {
    background-size: 26px;
    padding: 1px 11px 5px 36px;
}
	#video h2 {
    width: 112px;
}
	.cms_1-e .cate_box {
    width: 99.333%!important;
}
	.cms_1-e .cate_box figure {
		height: auto!important;
	}
	#contents1 h2, #contents2 h2, #contents3 h3 {
    font-size: 20px;
}
	#page_title .page_box::before {
    top: 80px;
    height: 324px;
    width: 246px;
}
#page04 #page_title .page_box::after {
top: -67px;
    height: 65px;
    width: 35px;
}
#page_title .page_box::after {
    height: 65px;
    width: 43px;
top: -66px
}
	#page06 #page_title .page_box::after {
    height: 90px;
    width: 61px;
}
	#top_cms .cms_title p {
    font-size: 12px;
}
	#cms_5-c .box_title1::before, #cms_5-c .box_txt1::before {
    left: 9px;
}
	.chatting h3, .chatting p {
		padding: 10px 20px 10px 39px;
	}
	.chatting p {
		margin: 10px 5px;
	}
}
@media all and (-ms-high-contrast: none) {
/*	#page10 ul li a {
		padding: 12px 0;
	}*/
	#main_menu ul li a::before {/*左メニューの横線*/
		top: 25%;
	}
	#top_cms .button {
		padding: 20px 0 7px;
	}
	.pc_box .contact_bt a {
		padding: 20px 0 11px;
	}
	.head_box {/*ロゴ部分がスクロールする*/
		-ms-overflow-style :none;
	}
	.tel_bt a, .foot_tel_bt a {
		padding:21px 0 9px
	}
	.tel_bt a i, .foot_tel_bt a i {
		padding-bottom: 3px;
	}
	#cms_5-b .cate_box .open_bt .box_title1::before, .cms_5-b .cate_box .open_bt .box_title1::before {
		top: -2px;
	}
	.cms_1-e .date, #cms_1-e .date{
		padding-bottom: 6px!important;
	}
	.cate_title {
		padding: 10px 0 0px 50px;
	}
	#cms_2-a .cate .cate_title {
		padding-top: 16px!important;
	}
	#page8 #contact_tel a {
		padding: 22px 10px 7px;
	}
	.close_bt {padding-bottom: 14px;
	}
	#page03 .banner span {
		padding-top: 9px;
	}
	.chatting h3 {
		padding: 19px 20px 0px 52px;
	}
	.chatting p {
		padding: 19px 20px 3px 52px;
	}
	#cms_5-c .box_txt1::before, #cms_5-c .box_title1::before {
		top: 17px;
	}
	.cate_list li a {
		padding: 19px 0 4px;
	}
	#page10 ul li a {
		padding: 19px 0 4px
	}
	#main_menu ul li a {
		font-size: 18px;
	}
}


