@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600&display=swap');

.txt1, .txt2, .txt4, .txt5, .txt7, .cate_title{font-family: 'Shippori Mincho', "游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";font-weight: 500;}
#main_menu li span{font-family: 'Raleway', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro," メイリオ", Meiryo, Osaka," ＭＳ Ｐゴシック", MS PGothic," sans-serif";}



/* color ---------------------------------------------------------------------------------------------*/
.linkStyle{color: #3BAF75;transition: opacity .3s;}
.linkStyle:hover{opacity: 0.7}
body,.txt_color_nomal{color: #333333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #3BAF75} /* メインカラー */
.txt_color2{color: #e6e6e6} /* サブカラー */
.txt_color3{color: #A26318} /* アクセントカラー1 */
.txt_color4{color: #c9baa9} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #3BAF75} /* メインカラー */
.bg_color2{background-color: #e6e6e6} /* サブカラー */
.bg_color3{background-color: #A26318} /* アクセントカラー1 */
.bg_color4{background-color: #c9baa9} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important}

/* border-color ※!important */
.border_color1{border-color: #3BAF75}
.border_color2{border-color: #e6e6e6}
.border_color3{border-color: #A26318}
.border_color4{border-color: #c9baa9}

/* hover_color */
.hvr_txt_color_nomal:hover{color: #333333;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #3BAF75} /* メインカラー */
.hvr_txt_color2:hover{color: #e6e6e6} /* サブカラー */
.hvr_txt_color3:hover{color: #A26318} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #c9baa9} /* アクセントカラー2 */

.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #3BAF75} /* メインカラー */
.hvr_bg_color2:hover{background-color: #e6e6e6} /* サブカラー */
.hvr_bg_color3:hover{background-color: #A26318} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #c9baa9} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important}

.hvr_border_color1:hover{border-color: #3BAF75}
.hvr_border_color2:hover{border-color: #e6e6e6}
.hvr_border_color3:hover{border-color: #A26318}
.hvr_border_color4:hover{border-color: #c9baa9}



/* loader ---------------------------------------------------------------------------------------------*/
#fakeloader{background-color: #ebfbf4;}
#fakeloader .fl{
	position: absolute;
	top: 49%!important;
	left: 50%!important;
	transform: translate(-50%,-50%);
	width: 50%;
	max-width: 183px;
}
#fakeloader .fl{
	animation-name: loader;
	animation-duration: 3s;
	animation-timing-function: ease;
	animation-iteration-count: 1;
}
@keyframes loader {
	0% {opacity: 0;}
	100% {opacity: 1;}
}


/* video ---------------------------------------------------------------------------------------------*/
#main_img{max-height: 100%;min-height: 100%;}



/* design ---------------------------------------------------------------------------------------------*/
.width_1280-max {width: 100%;max-width: 100%;}
#contents1,#contents2,#contents3,.width_1280-max{padding-left: 90px;padding-right: 50px;}
.txt_shadow-b{text-shadow: none;}
.button {
    background-color: #fff;
    color: #3baf75;
    border: none;
    text-shadow: 0 0 20px rgb(0 0 0 / 20%);
	border-bottom: 1px solid #3baf75;
	box-shadow: 0 0 19px rgba(0,0,0,0.06);
}
.button:hover{transform: translateY(0)}
.button:hover::after{box-shadow: inset 0 0 0 15em #3baf75;}
.button2{color: #fff;background-color: #3baf75; border-color: #3baf75}
.button2:hover{box-shadow: none;background-color: #A26318;border-color: #A26318}

header.bg_color4 {background: url( "../dup/img/header2.png" ) left bottom / 65% no-repeat #ebfbf4 ;height: 100vh;top: 0;}
header::before {
    position: absolute;
    content: "";
    width: 50px;
    height: 103%;
    top: 0;
    right: -49px;
    background-image: url(./Dup/img/header.png);
    background-size: 100% 100%;
    z-index: 1;
}
#main_menu ul li a::before{background-color: #A26318;}

.txt1{
	width: 90%;
    letter-spacing: 7px;
    line-height: 1.8;
    font-size: 32px;
	z-index: 11;
}
#main_img{position: relative}
#main_img::before {
	display: inline-block;
	content: "";
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.05);
	position: absolute;
	top: -4px;
	right: 0;
	left: 0;
	margin: auto;
	z-index: 10;
}
#contents1{padding-top: 95px;padding-bottom: 75px;}
.txt2, .txt4 {position: relative}
.txt2::before, .txt4::before  {
    position: absolute;
    content: "";
    width: 256px;
    height: 40px;
    background-image: url(./Dup/img/txt1.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    left: 0;
    top: -45px;
	opacity: 0.7;
}
.txt4::before{background-image: url(./Dup/img/txt2.png);}

.img5{position: relative;}
.img5 img{border-radius: 60% 52% 50% 62%/56% 50% 63% 54%;}
#contents3{position: relative;background-color: #edf7df;padding-top: 100px;padding-bottom: 80px;z-index: 1;}
#contents3::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 50px;
    left: 0;
    top: -1px;
    background-image: url(./Dup/img/bg_img1.png);
    background-size: 100% 100%;
    z-index: 3;
	transform: scale(1, -1);
}
#contents3::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 50px;
    left: 0;
    bottom: -1px;
    background-image: url(./Dup/img/bg_img1.png);
    background-size: 100% 100%;
    z-index: 3;
	transform: scale(-1, 1);
}



/* ---------- 日本語・英語切り替え---------- */
#main_menu li span{transition: 0.3s;}
#main_menu li span:nth-child(1){display: inline-block;}
#main_menu li span:nth-child(2),.contact_bt span:nth-child(3){
    opacity: 0;
    position: absolute;
    top: 0;
    left: 30px;
}
.contact_bt span:nth-child(3){
	top: 50%;
    left: 56%;
    transform: translate(-50%, -50%);
}
#main_menu ul li a:hover {padding-left: 30px;}
#main_menu ul li a:hover::before {width: 20px;}
.contact_bt a{position: relative}
#main_menu li a:hover span:nth-child(1),.contact_bt a:hover span:nth-child(2){opacity: 0;}
#main_menu li a:hover span:nth-child(2),.contact_bt a:hover span:nth-child(3) {opacity: 1;}



/* ---------- cms --------- */
.cate_title {
    background-color: transparent;
    padding: 0;
    margin: 0;
    display: block;
    border: none;
    width: 100%!important;
    font-size: 22px;
    text-align: left;
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: solid 1px #ccc;
    color: #3BAF75;
    font-weight: bold;
    position: relative;
}
.cate_title::before {
    position: absolute;
    content: "";
    width: 100px;
    height: 1px;
    left: 0;
    bottom: -1px;
    background-color: #3BAF75;
}



/* ---------- animation --------- */
.txt1 .anim{
	position: relative;
	right: 20px;
	opacity: 0;
}




/* IE */
@media all and (-ms-high-contrast: none){
	.pc_box .contact_bt a{padding: 15px 0 14px;}
	.contact_bt span:nth-child(3){top: 56%; }
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){

	.video{transform: none;width: 100%!important;}
	
	header.bg_color4{height: auto;background: url(../dup/img/header2.png) left bottom / 21% no-repeat #ebfbf4;}
	#logo{max-width: 252px;}
	.hamburger{top: 19px;}
	.main_box{padding-top: 73px;}
	#contents1, #contents2, #contents3, .width_1280-max{padding-left: 50px;}
	#contents2{padding-top: 100px;}
}

/* ---------- スマホ ---------- */
@media screen and (max-width: 667px){

	
	#logo{max-width: 172px;}
	.hamburger{top: 9px;}
	.main_box{padding-top: 58px;}
	.txt1{width: 94%;letter-spacing: 6px;font-size: 17px;}
	#contents1, #contents2, #contents3, .width_1280-max {padding-left: 20px;padding-right: 20px;}
	#contents2{padding-bottom: 50px;}
	#contents3::before, #contents3::after{height: 23px;}
	.img5{margin-top: 40px;}
	.cate_title{font-size: 18px}
	footer .logo{text-align: center;}
	footer .logo img{max-width: 167px;}
	footer .d_flex > .grid_5.grid_12_sp.mg_t-20px{text-align: center;}
	.footer_cms{text-align: left;display: inline-block;}
}