﻿/* all page */
/* color */
body,.txt_color_nomal{color: #333333;}
.txt_color1{color: #000;} /* メインカラー */
.txt_color2{color: #CDB6BC} /* サブカラー */
.txt_color3{color: #806060;} /* アクセントカラー1 */
.txt_color4{color: #56383a} /* アクセントカラー2 */

/* background-color */
.bg_color1{background-color: #56383A} /* メインカラー */
.bg_color2{background-color: #CDB6BC} /* サブカラー */
.bg_color3{background-color: #fb9292;} /* アクセントカラー1 */
.bg_color4{background-color: #56383a} /* アクセントカラー2 */

/* border-color ※!important */
.border_color1{border-color: #56383A}
.border_color2{border-color: #CDB6BC}
.border_color3{border-color: #ff33cc;}
.border_color4{border-color: #56383a}

.linkStyle{
    color: #c45f2c;
    text-decoration: underline;
}
.overlay {
    background: linear-gradient(135deg, rgba(221,179,179,0.9) , rgba(180,174,177,0.9) )!important;
}
.return a {
    color: #f37a3d;
}

.nav_menu_more:first-of-type a .icon:before {
    content: "\f075";
    top: -3px;
    left: -30px;
}

#wrap{
	position: relative;
}
#wrap::before{
    content: "";
	background-image: url("./Dup/img/main_bg.jpg");
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -99;
}
#fakeloader .fl {
    max-width: 300px;
}

/* top ----------------*/
/* header */
#pc_nav li, #top_pc_nav li, #footer_nav li {
    max-width: 200px;
}
#header{
	padding-top: 10px;
	padding-bottom: 10px;
}
header.scr_header #logo {
    max-width: 300px;
}
#pc_nav li .mailbanner::after{
    display: none;
}

/* main img */
#main_img:before {
    background-color: rgba(70,70,70,0.2);
}
#main_img .menu p{
	background: none;
}
#main_img .menu p a{
	max-width: 500px;
}
#main_img .catch{
	bottom: 140px;
    left: 50%;
    transform: translateX(-50%);
    color: #fff;
	text-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
#main_img .catch .catch1{
    font-size: 28px;
}
#main_img .catch .catch2{
    font-size: 20px;
}

/* main */
.back1:before {
    display: none;
}
.back2:before {
    display: none;
}

/* intro */
#intro_wrap, #contents3 .con_box {
    background-color: rgba(0,0,0,0.6);
    color: #fff;
}

/* contents */
#contents1 .con_box {
    margin-top: 15%;
    background-color: rgba(0,0,0,0.6);
    color: #fff;
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
}
#contents2 .con_box {
    background-color: rgba(0,0,0,0.6);
    color: #fff;
    padding-top: 20px;
    padding-left: 20px;
    padding-bottom: 20px;
}
#contents1_wrap::before{
	content: "";
	background-image: url("./Dup/img/siba1.png");
	background-position: bottom left;
	background-repeat: no-repeat;
	background-size: 150px;
    width: 150px;
    height: 250px;
    position: absolute;
    bottom: -1%;
    left: 2%;
    z-index: 1;
}
#contents2_wrap::before{
	content: "";
	background-image: url("./Dup/img/siba2.png");
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: 150px;
    width: 150px;
    height: 250px;
    position: absolute;
    bottom: 10%;
    right: 2%;
    z-index: 1;
}

/* topcms */
#top_cms{
	background-color: rgba(255,255,255,0.70);
}

/* footer */
#info_contact .con_img:before {
    background-color: rgba(0,0,0,0.3);
}
#footer_nav li a {
    color: #fff;
	text-shadow:  0 2px 5px #000;
	transition: 0.3s;
}
#footer_nav li a:hover {
    opacity: 0.5;
}
#footer_nav li a::after{
	display: none;
}

/* under page */
.page .con_box{
    background-color: rgba(255,255,255,0.80);
}
.page #footer_con .con_box{
    background-color: transparent;
}
.page #header {
    padding-top: 0;
    padding-bottom: 0;
}

/* cms1 */

/* cms2 */

/* cms3 */

/* cms4 */

/* cms5 */

/* page7 */
#page7 .cate_box {
    border-color: #56383a;
}

/* page8 */

/* page9 */

/* page10 */


/* IE */
@media all and (-ms-high-contrast: none){
    #cms_2-b .cate_title, #cms_2-d .cate_title{
        padding-bottom: 5px;
    }
    
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
	#logo {
		opacity: 0;
	}
	header.scr_header #logo {
		opacity: 1;
	}
	#main_img .menu p a {
		min-width: 350px;
	}
	#main_img .catch {
		bottom: -20px;
	}
	#main_img .catch .catch1{
		font-size: 24px;
	}
	#main_img .catch .catch2{
		font-size: 17px;
	}
	#logo2 a{
		max-width: 300px;
	}
    #contents1_wrap::before{
    	background-size: 130px;
        width: 130px;
    }
    #contents2_wrap::before{
    	background-size: 130px;
        width: 130px;
        bottom: 0;
        right: auto;
        left: 20%;
    }
    #page_title .page_title_box {
        width: 100%;
        background-color: rgba(86,56,58,0.7);
    }
    #page2 .pager .prev{
        margin-right: 0;
    }
	
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
#wrap::before{
	height: calc(100vh + 150px);
	bottom: 0;
}
	header.scr_header #logo {
		max-width: 160px;
	}
	#main_img .menu p a {
		min-width: 250px;
	}
	#main_img .catch {
		bottom: 10px;
	}
	#main_img .catch .catch1{
		font-size: 17px;
		letter-spacing: 0.8px;
	}
	#main_img .catch .catch2{
		font-size: 13px;
		letter-spacing: 0.8px;
	}
	#contents1 .con_box {
		margin-top: 0;
		padding: 20px;
	}
	#contents2 .con_box {
		padding: 20px;
	}
    #contents1_wrap::before{
        background-position: top left;
    	background-size: 100px;
        width: 100px;
        bottom: auto;
        top: 8%;
        left: 0;
    }
    #contents2_wrap::before{
        background-position: top left;
    	background-size: 100px;
        width: 100px;
        bottom: auto;
        left: auto;
        right: 0;
        top: 8%;
    }
	
}

/*20220124修正
#main_img .menu p {
    height: auto !important;
    margin-bottom: 200px;
    margin-top: 200px;
}
#main_img .catch {
    top: 50%;
    left: 50%;
    transform: translate(-50%, 0%);
}
#main_img .catch1, #main_img .catch2 {
    margin-bottom: 0!important;
    margin-top: 0!important;
}*/
/* ---------- 1280px ---------- */
@media screen and (max-width: 1280px){
    #main_img .catch {
        bottom: 60px;
    }
}
/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
	#main_img .catch {
		bottom: -20px;
	}
}
/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
	#main_img .catch {
		bottom: 10px;
	}
}
@media screen and (max-width: 320px){
	#main_img .catch .catch1 {
        font-size: 15px;
    }
	#main_img .catch .catch2 {
        font-size: 12px;
    }
}



