/* --------------------------------------------
 メインイメージ 
---------------------------------------------*/
.catch {
    z-index: 3;
    position: absolute;
    top: 6%;
    left: 2%;
    transform: translate(0%, 0%);
    width: 54%;
}
.catch_s {
    z-index: 3;
    position: absolute;
    bottom: 3%;
    left: 2%;
    transform: translate(0%, 0%);
    width: 54%;
}
#main_img .img1{
    height: 100vh;
    width: auto;
    position: absolute;
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}
@media screen and (min-width: 1780px){
    #main_img .img1{
        height: auto;
        width: 100%;
    }
}
/* タブレット */
@media screen and (max-width: 768px){
    #main_img{height: 40vh;}
    #main_img .img1{
        height: auto;
        width: 100%;
        transform: translate(-50%, 0%);
        top: 0%;
    }
    .catch {}
    .catch_s {left: 6%; width: 37%;}
}
/* スマホ */
@media screen and (max-width: 667px){
    #main_img{height: 84vh; max-height: 660px;min-height: 570px;}
    .catch {width: 95%; top: 3%; left: 1.5%;}
    .catch_s{width: 70%;}
}

/*---------------------------------------------
 テンプレート ・CMS・下層ページ 
--------------------------------------------*/
body{font-family: 'Kosugi Maru', sans-serif;}
.font_en{font-family: 'Kosugi Maru', sans-serif;}

header #logo{padding: 0 10px;}
#main_menu ul li a{font-weight: bold;}
#main_menu ul li a::before{background-color: #ff5f28;}
.more a{border-radius: 10px;}
.button:hover::after{box-shadow: inset 0 0 0 15em rgb(255 95 40);}
.cate_list li a,.pager li a,.contact_tel a{color: #fff; background-color: #ff5f28;border-radius: 10px; box-shadow: 0px 1px 6px #b5a99c;}
.cate_list li a:hover,.pager li a:hover,.contact_tel a:hover{background-color: #ffb45f; box-shadow: 0px 6px 8px #d5cfc8; transform: translateY(-5px);}
#contents1, #contents2, #contents3{font-weight: bold;}

#contents1,#page_title .title_img{
    background-color: #ff5f28;

	background-image: url('./Dup/img/bg2.png');
	background-size: 400px;
	background-position: top 0 left 0;
	background-repeat: repeat;
	animation: bgloop 20s linear infinite;
}
@keyframes bgloop {
	0% {background-position: top 0 left 0;}
	100% {background-position: top -400px left 400px;}
}
#contents1 .con_box{
    background-color: #fff7ee;
    border-radius: 20px;
    padding: 50px 4%;
}
#contents1 .con_box h2{text-align: center;}

#attach{
    background-image: url('./Dup/img/bg4.jpg');
    background-size: 100%;
    background-position: center bottom;
    background-repeat: no-repeat;
}

#contents2{
    position: relative;
    background-color: #fff7ee;
}
#contents2 .con_no{
    background-color: #fff7ee;
    border-radius: 15px;
    padding: 10px 15px;
}
#contents2 figure{z-index: 2;}
#contents2 h2{position: relative; text-align: center;background-color: #ff5f28; color: #fff; border-radius: 40px; padding: 10px 0px;}
#contents2 h2::before {
    content: " ";
    position: absolute;
    background-image: url('./Dup/img/list_icon.png');
    background-size: cover;
    width: 118px;
    height: 75px;
    bottom: 10px;
    left: 2%;
    
        animation: anime1 1s steps(2) -0.5s infinite;
    transform-origin: center bottom;
}
#contents2 h2::after {
    content: " ";
    position: absolute;
    background-image: url('./Dup/img/list_icon.png');
    background-size: cover;
    width: 118px;
    height: 75px;
    bottom: 10px;
    right: 2%;
    
        animation: anime1 1s steps(2) -0.5s infinite;
    transform-origin: center bottom;
}

#contents2::after {
    opacity: 0.4;
	position: absolute;
	z-index: 0;
	content: "";
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 136px;
	background-image: url("../dup/img/dec04.png");
	background-size: auto 100%;
	background-position-y: 0;
	background-position-x: 0;
	background-repeat: repeat-x;
	animation: loop 30s linear infinite;
}
@keyframes loop {
	0% {background-position-x: 0;}
	100% {background-position-x: -1000px;}
}
#contents3{
    background-image: url('./Dup/img/bg3.png');
    background-position: left bottom;
    background-size: 40%;
    background-repeat: no-repeat;
}
#contents3 .grid_6{margin-top: 50px;}
.txt{
    padding: 10px 10px;
    width: 100%;
    border-bottom: 2px dashed #ffc88d;
}
.other{width: 100%; text-align: right;}
.txt .check_icon{
    width: 40px;
    padding-right: 10px;
    animation: anime1 1s steps(2) -0.5s infinite;
    transform-origin: center bottom;
}
@keyframes anime1 {
    0% {
        transform: rotate(-5deg);
    }
    100% {
        transform: rotate(5deg);
    }
}

.txt .check_text{
    width: calc(100% - 50px);
    letter-spacing: 0.03em;
    /*color: #813202;*/
    color: #ffffff;
}

/*タイトル文字*/
.txt2,.txt4{
    font-size: 2em;
    letter-spacing: 0em;
    font-weight: 600;
}
.txt5,.txt7{
    font-size: 1.7em;
    letter-spacing: 0em;
    font-weight: 500;
    margin-bottom: 20px;
    background-color: #fd941c;
    border-radius: 10px;
    padding: 10px;
}
.cms_title h2,#page_title .page_box h2{
    font-size: 2em;
    font-weight: 600;
}
/*タイトル文字*/
/* 画像角丸 */
.img5 img, .img6, .img7{border-radius: 15px;}
/* 画像角丸 */

.cms_title h2,.cms_title p,#page_title .page_box h2,#page_title .page_box p{
    position: relative;
    text-shadow: 0px 0px 5px #fff,0px 0px 10px #fff,0px 0px 15px #fff;
    z-index: 2;
}
.cms_title h2::before,#page_title .page_box h2::before{
    content: "";
    background-image: url(./Dup/img/cms_dec.png);
    width: 200px;
    height: 200px;
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: -1;
    
    animation: 10s linear infinite rotation1;
}
@keyframes rotation1 {
    0% {
        transform: translate(-50%, -50%)rotate(0);;
    }
    100% {
        transform: translate(-50%, -50%)rotate(360deg);
    }
}

.dec2 {
    z-index: 2;
    width: 20%;
    right: -7%;
    bottom: -5%;
    animation-name:updownAnime2;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-direction: reverse;
    animation-duration:2.5s; /* アニメーション時間 */
}

@keyframes updownAnime2{
  0% {transform: translateY(0);}
  60% {transform: translateY(0);}
  70% {transform: translateY(5px);}
  80% {transform: translateY(0px);}
  90% {transform: translateY(5px);}
  100% {transform: translateY(0px);}
}

#top_cms > .box:last-of-type{padding-bottom: 150px;}

#cms_5-d .circle, .cms_5-d .circle{color: #ef450a;}
.cms_5-d .box_title1,#cms_5-d .box_title1{background-color: #ff5f28; color: #fff; font-weight:bold; text-align: center;}
#cms_5-d .box_title1:before, .cms_5-d .box_title1:before{border-color: #ff5f28 transparent;}
.cms_5-d .box_txt1,#cms_5-d .box_txt1{background-color: #ffefde; border-radius: 10px; padding: 20px 10px;}

.cms_1-g .date{max-width: 140px;}
#cms_2-a .cate_title{font-size: 1.7em; font-weight: 700;}
#cms_2-a .box_title1{font-size: 1.5em; font-weight: 700;} 

.contact_tel{border-radius: 10px;}
#page9 h3{letter-spacing: 0em;font-weight: 600;}

footer{
    background-color: #fff;
    z-index: 2;
    position: relative;
}
footer .logo img{max-width: 300px;}
/* タブレット */
@media screen and (max-width: 768px){
    header.pd_b-10px_tb{padding-bottom: 0;}
    header #logo{max-width: 300px;}
    .hamburger{top: 21px;}
    
    #contents1 .con_box{padding: 50px 5%;}
    #contents1 h2{
        text-align: center;
        max-width: 530px;
        margin: 0px auto 20px;
    }
    #attach{height: 250px;}
    
    #contents2 h2::before {height: 49px;width: 78px;left: 1%;}
    #contents2 h2::after {height: 49px;width: 78px; right: 1%;}
    #contents3 .grid_6{margin-top: 50px;}
}
/* スマホ */
@media screen and (max-width: 667px){
    header.pd_b-10px_tb{padding-bottom: 0;}
    header #logo{max-width: 220px;}
    .hamburger{top: 13px;}
    
    #contents1{padding: 100px 6%;}
    #contents1 .con_box{padding: 50px 5%;}
    #top_cms > .box{padding: 50px 6%;}
    .cms_title h2, #page_title .page_box h2{font-size: 1.3em; letter-spacing: 0em;}
    .cms_title h2::before, #page_title .page_box h2::before{width: 120px; height: 120px;}
    
    #contents1, #page_title .title_img{ background-size: 250px;}
    
    #contents2{padding: 80px 5% 150px;}
    #contents2 h2{border-radius: 14px;}
    #contents2 h2::before{bottom: -30px;}
    #contents2 h2::after{bottom: auto;top: -35px;}
    
    #attach{
    background-image: url('./Dup/img/bg4_sp.jpg');}
    
    .link_type2 .cate_box .txt_wrap h3{
        padding: 0;
        width: 280px;
        margin: 0 auto;
    }
    
}
/*一番下に出てくる-----------------------------*/
.dec1{
    /*max-width: 300px;*/
    width: 35%;
    bottom: 0;
    right: 0;
    z-index: 1;
}
.in1{
    transform: translateY(140px);
	transition: transform 1.3s ease, opacity 1s;
	transition-property: opacity,transform;
	opacity: 1;
}
.in1.start1{transform: translateY(0px);opacity: 1;}
/* タブレット */
@media screen and (max-width: 768px){
    .dec1{width: 45%;}
}
/* スマホ */
@media screen and (max-width: 667px){
    .dec1{width: 80%;}
}

/*ひょっこり出てくる-----------------------------*/
.dec7{
    max-width: 140px;
    width: 100%;
    top: 90px;
    left: 0px;
}
.in2{
    transform: translateX(-140px);
	transition: transform 1.5s ease, opacity 2s;
	transition-property: opacity,transform;
	opacity: 1;
}
.in2.start2{transform: translateX(0px);opacity: 1; top: -10px;}
/* スマホ */
@media screen and (max-width: 667px){
    .dec7{max-width: 100px;}
    .in2.start2{top: 30px;}
}
/* link_type2 ----------------------------*/
.link_type2 .cate_box{
    background: transparent;
}
.link_type2 .cate_box a {
    color: #fff;
    border-radius: 15px;
    /*box-shadow: 10px 25px 30px rgb(0 0 0 / 8%);*/
    padding: 17% 0px;
    width: 98%!important;
}
.link_type2 .cate_box a:before, .link_type2 .cate_box a:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(253,148,28,0.7);
    z-index: 1;
}
.link_type2 .cate_box a:after {
    top: 100%;
    background-color: #ff5f28;
    transition: 0.5s;
	z-index: 3;
	
	background-image: url(./Dup/img/bg1.png);
	background-size: cover;
}
.link_type2 .cate_box a:hover:after {
    top: 0;
}
.link_type2 .cate_box .txt_wrap {
    z-index: 2;
}
.link_type2 .more {
	letter-spacing: 3px;
    box-sizing: border-box;
	opacity: 0;
	transition: opacity .8s;
	z-index: 4;
}

.link_type2 .cate_box a:hover .more {
    opacity: 1;
    text-shadow: 0px 0px 5px #ff5f28,0px 0px 7px #ff5f28;
}

/*左右に動く*/
.demo_item{
	width: 250px;
    height: 200px;
    border-radius: 10px;
    background-image: url("../dup/img/dec05.png");
    background-size: contain;
    background-position: 0 0;
    background-repeat: no-repeat;
    display: block;
    position: relative;
}
.demo_item.anime{
    animation-name: upDown;
    animation-iteration-count: infinite;
    animation-duration: 0.1s;
    animation-direction: alternate;
    animation-timing-function: steps(2);
    transition-duration: .3s;
    transition-property: transform;
}
.demo_stage{
    position: relative;
    width: 100%;
    height: 300px;
    bottom: 0px;
    display: block;
	border-bottom: solid #b3855d 2px;
}
.demo_wrap{
	display: block;
    position: absolute;
    bottom: 0px;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
    animation-duration: 15s;
    animation-iteration-count: 1;
	margin-right: -25px;
}
.demo_wrap[data-order="left"] {
    animation-name: GoLeft;
}
.demo_wrap[data-order="right"] {
    animation-name: GoRight;
}
[data-order="right"] > .demo_item {
    transform: rotateY(180deg);
}
@keyframes GoLeft {
	0% {right: 10%;}
	100% {right: 90%;}
}
@keyframes GoRight {
	0% {right: 90%;}
	100% {right: 10%;}
}
@keyframes upDown {
	0% {top: 0;}
	100% {top: 3px;}
}
/* タブレット */
@media screen and (max-width: 768px){
    .demo_stage{height: 250px;}
}

/*--------------------------------------------
 全体 
----------------------------------------------*/
.linkStyle{
	color: #ff5f28;
	text-decoration: underline;
	transition: all 0.5s;
}
.linkStyle:hover{
	color: #ff5f28;
	opacity: 0.7;
	text-decoration: none;
}


.txt_color1,.hvr_txt_color1:hover{color: #ff5f28;} 
.txt_color2,.hvr_txt_color2:hover{color: #fd941c;} 
.txt_color3,.hvr_txt_color3:hover{color: #fd941c;} 
.txt_color4,.hvr_txt_color4:hover{color: #813202;} 
/*.txt_color5,.hvr_txt_color5:hover{color: #f2ede7;}*/ 

.bg_color1,.hvr_bg_color1:hover{background-color: #ff5f28;}
.bg_color2,.hvr_bg_color2:hover{background-color: #ffefde;}
.bg_color3,.hvr_bg_color3:hover{background-color: #fd941c;} 
.bg_color4,.hvr_bg_color4:hover{background-color: #ffefde;} 
/*.bg_color5,.hvr_bg_color5:hover{background-color: #f2ede7;}*/ 

.border_color1,.hvr_border_color1:hover{border-color: #ff5f28;}
/*.border_color2,.hvr_border_color2:hover{border-color: #f4f3f2;}*/
.border_color3,.hvr_border_color3:hover{border-color: #fd941c;}
/*.border_color4,.hvr_border_color4:hover{border-color: #eae4df;}*/
/*.border_color5,.hvr_border_color5:hover{border-color: #f2ede7;}*/