﻿/*--------リンク・フォント--------*/
body{
	font-family: 'NotoSans', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif";font-size:16px;}
#contents1 h2,#contents2 h2,#main_img h2{font-family: "NotoSans","游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
#footer_menu ul li a,#copyright .font_en,.fat-nav li a{font-family: "NotoSans","游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
#page_title .page_box h2{font-family: "NotoSans","游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

@font-face {
    font-family: 'NotoSans';
    font-style: normal;
    font-weight: 400;
    src: url('../Dup/img/NotoSans_r.woff') format('woff'),
        url('../Dup/img/Notosans_r.eot')  format('eot');
    font-display: swap;
}
@font-face {
    font-family: 'NotoSans';
    font-style: normal;
    font-weight: 700;
    src: url('../Dup/img/Notosans_bold.woff') format('woff'),
        url('../Dup/img/Notosans_bold.eot')  format('eot');
    font-display: swap;
}

.linkStyle{color: #333333; text-decoration: underline;}

#contents1 .font_14,#contents2 .font_14,#contents3 .font_14{font-size:calc(1rem);}

#contents3 span{
    border: 1px solid #573001;
    width: 75%;
    margin: 6% 0 1.5%;
}

/*--------全体--------*/
.width_98per {width: 98%!important;}
.add_shadow{box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;}
#container{
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 99999;
}
#container > svg {
      position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 200px;
}
.progressbar-text{color:#fff!important;}

.head_box .contact_bt a .fa-envelope:before { content: "\f095";}
.head_box .tel_bt{display:none;}
header.bg_color4 {background-color: #fff;}
#logo img{width: 100%!important;}

main{
    padding-bottom: 50px;
    background-color: #fff7ea;
    position: relative;
    z-index: +1;
    overflow: hidden;
}
 main:before{
    content: " ";
    position: fixed;
    display: inline-block;
    width: 80vw;
    height: 100%;
    background: url(./Dup/img/back.jpg) no-repeat;
    background-size: cover;
    right: 0px;
    bottom: 0px;
    z-index: -10;
  }
#main_img::before{
    content: "";
    position: absolute;
    display: inline-block;
    background: url(./Dup/img/main_catch.png) no-repeat;
    background-size: contain;
    z-index: 5;
    width: 35%;
    height: 32%;
    left: 50%;
    top: 47%;
    transform: translate(-50%, -50%);
}

#main_img h2{
    font-size: 2.5rem;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.7);
}
.pc_box .link_box ul li{width: 13%!important;}

#main_menu{margin: 40% 0 20%;}
#main_menu li{
    position: relative;
    margin-bottom: 30px;
    transition: 0.3s;
    color: #b9b9b9;
}
#main_menu li a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-size: 1.08rem;
    font-weight: 700;
    margin-bottom: 0px;
}
#main_menu li span{
    display: block;
    padding-top:25px;
    font-size: 1rem;
    font-weight: bold;
}
#main_menu li:hover,#main_menu li a:hover{
    color:#ad3a03;
    transition: 0.3s;
}
@media screen and (min-width:769px){
    header.grid_3 {width: 20%!important;box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;}
    .main_box {width: 80%!important;}
    .main_box { margin-left: 20%;}
    .head_box.width_300-max {width: 100%; max-width: none;}
    .head_box{padding-left: 10%;padding-right: 10%;}
    .pc_box .contact_bt{margin-top:35px;    }
    #contents2 .grid_6{padding-left: 4%;}
    #contents2 figure{width: 45%!important;}
}

#contents_box{
    overflow: hidden;
    position: relative;
}
#contents_box::before{
    content: "";
    position: absolute;
    display: inline-block;
    background: url(./Dup/img/item_01.png) no-repeat;
    background-size: contain;
    z-index: 0;
    opacity: 1;
    width: 63%;
    height: 36%;
    right: 0px;
    top: 0px;
}
#contents1{position:relative;}
#contents1:before{
    content: "";
    display: block;
    width: 109%;
    height: calc(100% - 100px);
    position: absolute;
    background-color: rgba(255, 255, 255, .9);
    top: 95px;
    right: -135px;
    z-index: -1;
}
#contents1 h2{
    width: 75%;
    position:relative;
    font-size: 1.7em;
    padding: 1.5rem;
    color: #fff;
    font-weight: bold;
}
#contents1 h2:before{
    content: "";
    width: 117%;
    height: 100%;
    background: #fba41e;
    position: absolute;
    top: 0px;
    left: -17%;
    z-index: -1;
}
#contents1 p{	
    padding: 15px 100px 15px 50px;
}
#attach { display: none;}
#contents2 .grid_6,
#contents2 figure{z-index:+1;}
#contents2 .con2_bg{position: relative;}
#contents2 .con2_bg:before{
    content: "";
    display: block;
    width: 60%;
    height: calc(100% - 20px);
    position: absolute;
    background-color: rgba(255, 231, 172, .68);
    top: 49px;
    left: 5px;
    z-index: 0;
}

#contents2 p{margin-top: 6%;    padding-left: 30px;}

#contents3{
    margin: 6% auto;
    position: relative;
    padding: 50px 0;
}
#contents3::before{
    content: "";
    position: absolute;
    display: inline-block;
    background: url(./Dup/img/item_02.png) no-repeat;
    background-size: contain;
    z-index: 0;
    opacity: 1;
    width: 80%;
    height: 66%;
    left: -129px;
    bottom: -101px;
}
#contents3 .con3_txt{
    width: 90%;
    margin: -55px auto 0;
    border-radius: 5px;
    position: relative;
    background-color: #fff;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
#contents3 h3{	
    padding: 20px 20px 0px;
    font-size: 1.5em;
    font-weight: bold;
}
#contents3 p{	    
    padding: 20px 20px 40px;
}

#top_cms .box{position:relative;}
#top_cms .box:nth-of-type(1):before,#top_cms .box:nth-of-type(4):before{
    content: "";
    width: 140%;
    height: 100%;
    background: #fff;
    position: absolute;
    top: 0px;
    left: -17%;
    z-index: -1;
}
#top_cms .cms_title h2,#top_cms .cms_title p{
    font-weight: bold;
}

.link_box ul{
    justify-content: space-around;
}

.more{
    text-align: center;
}

.button {
  font-weight: bold;
  background: #fff;
  border: 2px solid #333;
  box-shadow: 0 3px 0 #333;
  border-radius: 6px;
  padding: 1rem;
  max-width: 220px;
  width: 100%;
  display: inline-block;
  transition: .3s;
}
.button:hover {
  transform: translateY(3px);
  box-shadow: 0 0 0 #333;
  background-color: #f9a238;
}
.button i{position:relative;}

@media screen and (max-width:1560px){
    .button {max-width: max-content;}
}
.more .button{    max-width: 280px;}
.contact_bt .button:before {left: 108px;}
.contact_bt .button:hover:before {left: -22px;}

@media screen and (min-width:769px) and (max-width:1050px){
.contact_bt a span{    font-size: 1.7vw;}
.contact_bt .button:before { left: 101px;}
.contact_bt .button:hover:before { left: -31px;}
}

footer{
    background-color: #ffecbe;
    max-width: inherit!important;
    padding: 3% 10%!important;
    position: relative;
    z-index: +1;
}
footer .footer_cms{color: #212121;}

.foot_tel_bt .button:before {left: 112px;}
.foot_tel_bt .button:hover:before {left: -19px;}

footer .logo img{max-width: 290px;}

.fadein {
    opacity : 0;
    -webkit-transform : translate(0, 60px);
    -ms-transform : translate(0, 60px);
    transform : translate(0, 60px);
	transition: all 0.3s
}
.fadein.scrollin {
    opacity : 1;
    -webkit-transform : translate(0, 0);
    -ms-transform : translate(0, 0);
    transform : translate(0, 0);
}

/*--------下層--------*/
#page_title .page_box h2,#page_title .page_box p{
    text-shadow: none;
    font-weight: bold;
}

.cate_list li a{padding: 10px 10px 10px 10px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.cate_list li a:hover,.pager a:hover{ border-radius: 12px;}
.cate_title{
  border-bottom: solid 3px #ccc;
  position: relative;
}
.cate_title::after{
  content: '';
    display: block;
    background: #fe9c05;
    width: 30%;
    height: 3px;
    position: absolute;
    left: 0;
    bottom: -3px;
}
#cms_6-c .cate_box{position:relative;z-index:+1;}
#cms_6-c .cate_box:nth-of-type(odd):before{
    content: "";
    box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(173, 58, 3, .07);
    top: 19px;
    left: 17px;
    z-index: -5;
}
#cms_6-c .cate_box:nth-of-type(even):before{
    content: "";
    box-shadow: rgba(0, 0, 0, 0.1) -4px 9px 25px -6px;
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(173, 58, 3, .07);
    top: -19px;
    left: -17px;
    z-index: -5;
}
#cms_6-b .cate_box:first-of-type,.cms_6-b .cate_box:first-of-type {
    border-top: 0;
}
#cms_6-b #cate1 .box_wrap {
	border: 3px solid #d75602;
}


/*--------6-b flow--------*/

#cms_6-b #cate1 .cate_box {
	padding: 30px;
	width: 100%!important;
    background-color: #faf1e8;
}
#cms_6-b #cate1 .box_txt1 {
    background-color: #ffffff;
    border-right: 1px solid #d75602;
    color: #d75602;
    text-align: center;
}
#cms_6-b #cate1 .box_txt2 {
    padding: 10px 20px;
}
#cms_6-b #cate1 .cate_box:not(:last-child) {
	border-bottom: 3px solid #d75602;
	position: relative;
}
#cms_6-b #cate1 .cate_box:not(:last-child)::before,
#cms_6-b #cate1 .cate_box:not(:last-child)::after {
	content: "";
	border: solid transparent;
	position: absolute;
	top: 100%;
	left: 17%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: 20;
}
#cms_6-b #cate1 .cate_box:not(:last-child)::before {
	border-width: 22px;
	border-top-color: #d75602;
}
#cms_6-b #cate1 .cate_box:not(:last-child)::after {
	border-width: 18px;
	border-top-color: #faf1e8;
}

#cms_6-b #cate1{counter-reset: number 0;}

#cms_6-b #cate1 .box_txt1::before {
    counter-increment: number 1;
    content: "step." counter(number);
    background-color: #d75602;
    padding: 5px 10px;
    font-weight: 700;
    color: #ffffff;
    display: block;
    margin: 0px auto 10px;
    width: 50%;
}

/*----------------*/
/*
#page8 #contact_tel a span:before {
	content: '';
	display: block;
	position: absolute;
	width: 1px;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #dddddd;
	opacity: 0.7;  
}

#page8 #contact_line a span:before {
	content: '';
	display: block;
	position: absolute;
	width: 1px;
	height: 100%;
	top: 0;
	left: 0;
	background-color: #dddddd;
	opacity: 0.7;  
}
*/
#page8 #contact_line a i{color:  #00b900;}


#page9 .box p a{    padding: 5px 10px 7px;}


/*--------タブレット--------*/
@media screen and (max-width: 768px){
.mg_left{margin-left:auto;}
.width_98per {width: 70%!important;margin: inherit;}
header{padding: 1.8% 0!important;}
.main_box {
    padding-top: 68px;
}
 main:before{
    width: 100%;
    background: url(./Dup/img/back_sp.jpg) no-repeat;
  }
  #contents_box::before {
    width: 81%;
    height: 15%;
  }
  #contents1:before {
    right: -104px;
  }
#contents2 figure{
    padding-top: 5%;
    margin: 0 auto;
}
#contents2 .con2_bg:before {
    width: 95%;
    height: calc(100% - 155px);
    top: 18px;
    left: 50%;
    transform: translateX(-50%);
    right: 0;
}
#contents3::before {
    width: 100%;
    height: 34%;
    bottom: -73px;
}
#contents3 .con3_bg:before {height: 100%;}
footer .link_box li {    max-width: 30px;}
.button {
    max-width: 300px;
}
#cms_6-b .sub_cate_box {
    width: 100%!important;
}

}

/*--------スマートフォン--------*/
@media screen and (max-width: 667px){
    .width_98per {width: 98%!important;}
    .pd_15px_sp{padding: 15px;}
    #container > svg {
    height: 165px;
}
header {
    padding: 2% 0 3%!important;
}
header #logo{
    max-width: 165px;
    padding-top: 3px;
}
#main_img::before {
    display: none;
}
.main_box {
    padding-top: 54px;
}
#contents_box::before {
    width: 100%;
    height: 10%;
}
#contents1:before {
    height: calc(100% - 79px);
    background-color: rgba(255, 255, 255, .9);
    top: 67px;
    right: -49px;
}
#contents1 h2 {
display: block; 
padding: 3% 4%;
font-size: 5vw;
width: 89%
}
#contents1 p { margin-top: 3%;padding: 5% 7%;}
	#contents2 h2 {
    font-size: 6.5vw;
    padding-top: 0;
    padding-right: 0;
}
#contents2 .con2_bg:before {
    top: 20px;
    left: 50%;
    width: 106%;
    height: 81%;
}
#contents3::before {
    width: 125%;
    height: 23%;
    bottom: -73px;
}
#contents3 span {width: 100%;}
.button {
    max-width: 270px!important;
}
footer .logo img { max-width: 250px;}
article.pd_r-40px {
    padding-right: 20px;
}
#cms_6-b #cate1 .cate_box:first-child {
    padding: 20px 20px 30px 20px;
}
#cms_6-b #cate1 .cate_box:not(:first-child) {
    padding: 40px 20px 20px 20px;
}
#cms_6-b #cate1 .cate_box:not(:last-child)::before, #cms_6-b #cate1 .cate_box:not(:last-child)::after {
    left: 50%;
}
#cms_6-b #cate1 .cate_box:not(:last-child)::after {
    border-top-color: #fff7ea;
}
}



/*--------------------------------------------
IE
--------------------------------------------*/
@media all and (-ms-high-contrast:none){
    #container{display: none;}
    .cate_list li a{padding:10px 10px 12px 10px;}
.linkStyle{text-decoration: underline;}
#cms_6-b #cate1 :not(:last-child).cate_box::before, #cms_6-b #cate1 :not(:last-child).cate_box::after{top:98.1%;}
#page8 #contact_line a span:before { height: 85%;}

#page8 #contact_tel a span::before,#page8 #contact_line a span::before{height:85%;}
}