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

body{font-family: 'Noto Serif JP','Sawarabi Mincho',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif"}



/* color ---------------------------------------------------------------------------------------------*/
body,.txt_color_nomal{color: #fff;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: rgba(255,215,0,1)} /* メインカラー */
.txt_color2{color: #fff7ec} /* サブカラー */
.txt_color3{color: #424242} /* アクセントカラー1 */
.txt_color4{color: #e3e0cf} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #000} /* メインカラー */
.bg_color2{background-color: #000} /* サブカラー */
.bg_color3, #page9 .box_wrap .box p a{background-color: #424242} /* アクセントカラー1 */
.bg_color4{background-color: #e3e0cf} /* アクセントカラー2 */
.bg_color_clear, #page9 .box_wrap, #page10 .box_wrap{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #ff0000}
.border_color2{border-color: #fff7ec}
.border_color3{border-color: #424242}
.border_color4{border-color: #e3e0cf}

/* color */
.hvr_txt_color_nomal:hover{color: #fff;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #000} /* メインカラー */
.hvr_txt_color2:hover{color: #fff7ec} /* サブカラー */
.hvr_txt_color3:hover{color: #424242} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #e3e0cf} /* アクセントカラー2 */

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

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #ff0000}
.hvr_border_color2:hover{border-color: #fff7ec}
.hvr_border_color3:hover{border-color: #424242}
.hvr_border_color4:hover{border-color: #e3e0cf}

.pager li a{background-color: #424242;}



/* ---------- all ---------- */
.linkStyle{
	color: #fff;
}
.linkStyle:hover{
	color: #fff;
	opacity: 0.7;
	transition: all 0.5s;
}

main_right header{padding-top: 70px;}
h1 a{
	display: block;
    max-width: 448px;
    margin: 0 auto;
	transform: translateX(-22px);
}
header, #top_header {
    border-bottom: solid 1px #333!important;
    background-image: url(./Dup/bg1.jpg);
    background-position: center;
    background-size: cover;
}


/* ---------- top ---------- */
#main_left #footer_txt{border-radius: 0;}
#left_bar div{
	border-radius: 0;
    border: 1px solid #fff;
    z-index: 2;
}
.top header, .links_bt{position: relative;z-index: 1}
.top header::before, .links_bt::before, .links_bt::after{
	content: '';
	display: inline-block;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -1;
}
.top header::before{
	background-image: url(./Dup/top_bg.png);
	background-size: 70%;
	background-position: bottom right;
}
.links_bt::before{
	background-image: url(./Dup/touch_bg.png);
	background-size: 100%;
	background-position: center center;
}
.links_bt::after {
    background-image: url(./Dup/touch_txt.png);
    background-size: 76%;
    background-position: center bottom;
    right: -3px;
}
#top_header {background-color: transparent!important;}

#top_link{margin-top: -21px;}
#top_link .links_bt{width: 35%!important;}
.links_bt img{transform: scale(1.18);}
.links_bt:hover img{animation: bulu 2.6s infinite;}
.links_bt::before{transition: 0.5s ease-in-out;transform: rotate(45deg) scale(1.1);}

@keyframes bulu {
    0% {transform: translate(0px, 0px) rotateZ(0deg) scale(1.18)}
    2% {transform: translate(2px, 2px) rotateZ(2deg) scale(1.18)}
    4% {transform: translate(0px, 2px) rotateZ(0deg) scale(1.18)}
    6% {transform: translate(2px, 0px) rotateZ(-2deg) scale(1.18)}
    8% {transform: translate(0px, 0px) rotateZ(0deg) scale(1.18)}
    10% {transform: translate(2px, 2px) rotateZ(2deg) scale(1.18)}
    12% {transform: translate(0px, 0px) rotateZ(0deg) scale(1.18)}
    14% {transform: translate(2px, 0px) rotateZ(-2deg) scale(1.18)}
    16% {transform: translate(0px, 2px) rotateZ(0deg) scale(1.18)}
    18% {transform: translate(0px, 0px) rotateZ(0deg) scale(1.18)}
    100% {transform: translate(0px, 0px) rotateZ(0deg) scale(1.18)}
}
#pc_tel img{transform: translateY(3px);}

#pc_intro .fs_wrap h3{width: 40%!important}
#pc_intro .fs_wrap h2{font-size: 22px;margin-bottom: 30px;}
#pc_intro .fs_wrap div {
    border-radius: 0;
    background-image: url(./Dup/bg2.jpg);
    background-size: cover;
	color: #fff;
}
#contents {background-color: #2f2f2f}
#contents .box_txt {
    border-radius: 0;
}
#contents h3{position: relative;}
#contents h3::before {
    content: '';
    display: inline-block;
    width: 300px;
    height: 300px;
    background-image: url(./Dup/con_h3_bg.png);
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: -1;
    opacity: 0.15;
}

#page_title {
    background-image: url(./Dup/bg2.jpg);
    background-size: cover;
}


/* ---------- モノクロimg ---------- */
.bwWrapper img{transition: all .8s;-webkit-filter: grayscale(100%);filter: grayscale(100%)}
.bwWrapper img:hover{-webkit-filter: grayscale(0);filter: grayscale(0)}


/* ---------- 下層 ---------- */
.cate_list{margin-bottom: 60px;}
#cms_2-b .cate_box{border: none;background-color: #2b2b2b;}
#cms_2-b figure img,#cms_2-b .border_color1{border: none;}
#cms_2-b .border_color3 {border-left: 7px solid;border-color: #ff0000;}



/* IE */
@media all and (-ms-high-contrast: none){ 
#cms_1-e .date{padding-top: 10px;}
.pager li a span{padding-top: 2px;}
#cms_2-a .cate .cate_title, .cate_list li a{padding-top: 10px;}
#page9 .box_wrap .box p a{padding-top: 4px}
}


@media screen and (min-width: 769px){
header, #page_title, #page_container {
    padding-left: 50px!important;
	padding-right: 50px!important;
}
}


/* ----------　タブレット　---------- */
@media screen and (max-width: 768px){
#main_right header {
    padding-top: 0;
}
header{
	background-image: none;
}
.top header::before, #link_bt.links_bt::before{
	display: none
}
header h1.grid_6 {
    width: 44%!important;
}
header h1 a{
	height: 17vh;
}
#top_header{
    margin-bottom: 0;
}
header #top_header .tel_bt a, header #top_header .intro_bt a {
	background-color: transparent;
}
}


/* ----------　スマホ　---------- */
@media screen and (max-width: 667px){
#contents .fs_wrap{
	width: 90%!important;
	padding-top: 50px;    
	padding-bottom: 50px;
}
h1 a{
	transform: translateX(-11px);
}
header h1 a{
	height: 13vh;
}
#contents h3 {
	margin-bottom: 80px!important;
}
#contents h3::before{
	width: 174px;
    height: 174px;
}
#contents h3 span {
    font-size: 20px;
}
#contents h3 span:before{
    height: 50px;
}
header #top_link .links_bt{
	width: 45%!important;
	top: 50%!important;
}

}