@charset "utf-8";
/* CSS Document */

body,.font_sans-serif{font-family: "source-han-sans-japanese", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;font-weight: 300}
.allumi{
	font-family: allumi-std, sans-serif;
	font-weight: 600;
	font-style: normal;
}

/***　全ページ　***/

html{font-size:14px;}
body{-webkit-text-size-adjust: 100%;}

#page-top{
	width: 60px;
	height: 60px;
	right: 0;
	z-index: 1
}
#page-top a::before,#page-top a::after{
	width: 20px;
	height: 1px;
	background-color: #fff;
	top: 25px;
}
#page-top a::before{
	transform: rotate(-30deg);
	transform-origin: right top;
	right: 30px
}
#page-top a::after{
	transform: rotate(30deg);
	transform-origin: left top;
	left: 30px
}
.banner_wrap{
	height: 60px;
	right: 60px;
	bottom: 0;
	z-index: 1
}
.linkStyle{transition: 0.5s;color: #B3B3B3}
.linkStyle:hover{opacity: 0.8}

#main_img .scrolldown span::before,#intro .intro_box h3::before,.more a::before,#contents .con_box h2::before,#page-top a::before,#page-top a::after,#sp_nav a.posi_rel::before,#main_img::before,#page10 a::before,#page9 .tel_bt::before,#page9 #privacy h3::before,#pager li.prev a::before,#pager li.next a::before,#page7 .box_title1::before,#page7 .box_title1::after,#page7 .box_txt2::before,#page7 .box_txt2::after,.cate_title::before,#page4 .box_title1::before,#page5 .cate_box::before,#page6 .box_txt1::before{
	content: "";
	display: block;
	position: absolute;
	pointer-events: none
}
.cate:last-child,.cate_box:last-child{
	margin-bottom: 0
}
#loading_bg{
	height: 100vh;
	width: 100vw;
	z-index: 200
}
#loading{
	top: 0;
	bottom: 0;
	margin: auto;
	width: 100vw;
	height: 2px;
}
#loading .gauge{
	width: 0
}

.yoyaku_bt{
	top: 130px;
	right: -80px;
	transform: translateX(20px);
	z-index: 4
}
.yoyaku_bt:hover{
	transform: translateX(0);
}

/***　ヘッダー　***/

header{z-index: 5}
header{top: -1px;left: 0}
header.schead #header{
	padding: 20px
}
header.schead #header img{
	width: 60%!important
}
#pc_nav a:hover{transform: translateY(5px)}
#pc_nav{line-height: 1.2}

.menu_stick{
	top: 0;
	bottom: 0;
	right: 20px;
	margin: auto;
	cursor: pointer;
	z-index: 102;
	width: 50px;
	height: 50px;
	padding-top: 12px;
	box-sizing: border-box
}
.menu_stick.stick_trans span{
	transform: rotate(225deg);
	margin: 0;
	border-color: #E0204D
}
.menu_stick.stick_trans{
	padding-top: 22px;
}
.menu_stick.stick_trans span:first-child{
	opacity: 0;
}
.menu_stick.stick_trans span:last-child{
	transform: rotate(-225deg);
	margin-top: -2px
}
#sp_nav{
	z-index: 100;
}
#sp_nav .nav_bg{background-color: rgba(10,10,10,0.8)}
#sp_nav nav{
	overflow-y: scroll;
	box-sizing: border-box;
	top: 0;
	right: -301px;
	width: 300px;
	height: 100%;
}
#sp_nav nav.stick_trans{right: 0}
#sp_nav .nav_bg{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#sp_nav a.posi_rel::before{
	width: 20px;
	height: 1px;
	background-color: #E0204D;
	left: 0;
	top: 20px;
}
#sp_nav li{transform: translateX(20px);opacity: 0;transition: 0.3s}
#sp_nav li.scrollin{transform: translateX(0);opacity: 1}

/***　フッター　***/

footer .h1_text{background-color: rgba(255,255,255,0.05)}
footer{background-image: url("../img/footer_img.jpg")}

/***　index　***/

.top_page_title span{transform: translateX(20px);opacity: 0;transition: 0.3s;display: inline-block}
.top_page_title span.scrollin{transform: translateX(0);opacity: 1}
#main_img{min-height: 500px}
#main_img .main_box_title:first-letter{color: #E0204D}
#main_img .scrolldown{
	right: 0;
	left: 0;
	margin: auto;
	bottom: 0;
}
#main_img .scrolldown span{
	width: 1px;
	height: 50px;
	background-color: rgba(255,255,255,0.5);
}
#main_img .scrolldown span::before{
	width: 100%;
	background-color: #fff;
	left: 0;
	animation: line 4s ease 0s infinite;
}
@keyframes line {
	0% {
		bottom: 100%;
		height: 0;
	}
	20% {
		bottom: 0;
		height: 100%;
	}
	40% {
		bottom: 0;
		height: 0;
	}
	100% {
		bottom: 0;
		height: 0;
	}
}

#intro .intro_box_wrap{background-image: url("../img/intro_img.jpg")}
#intro .intro_box h3::before{
	width: 50px;
	height: 1px;
	background-color: #E0204D;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto
}
#intro h2{
	right: 0;
	left: 0;
	margin: auto;
	top: 10%
}
#intro .more{
	right: 0;
	left: 0;
	margin: auto;
	bottom: 10%
}

.more a::before{
	height: 1px;
	left: 0;
	bottom: -1px;
	width: 0;
	background-color: #E0204D;
	transition: 0.3s
}
.more a:hover::before{
	width: 100%
}

#contents .con_box{z-index: 1}
#contents .con_box figure{
	top: 50%;
	z-index: -1;
	width: 65%;
}
#contents .con_box .con_img1{
	left: -7%;
	margin: auto;
	transform: skewX(10deg) translateY(-50%);
}
#contents .con_box .con_img2{
	right: -7%;
	margin: auto;
	transform: skewX(-10deg) translateY(-50%);
}
#contents .con_box .con_img1 img{
	transform: skewX(-10deg);
	right: -7%
}
#contents .con_box .con_img2 img{
	transform: skewX(10deg);
	left: -7%
}
#contents .con_box h2::before{
	width: 1px;
	height: 30px;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	background-color: #E0204D
}

#top_staff .width_1280-max{z-index: 1}
#top_staff figure{z-index: -1;}

#top_blog .cate_box{
	width: -webkit-calc(33.3333% - 6px);
	width: calc(33.3333% - 6px);
}
#top_blog .fadein_blog{
    opacity : 0;
    transform : translate(0, 20px);
	transition: all 0.5s
}
#top_blog .fadein_blog.scrollin{
    opacity : 1;
    transform : translate(0, 0);
}

/***　page_title/cate_title/cate_list/pager　***/

#page_title div{background-color: rgba(0,0,0,0.5)}
#page_title span{transform: translateX(20px);opacity: 0;transition: 0.3s;display: inline-block}
#page_title span.scrollin{transform: translateX(0);opacity: 1}
#pager li{
	padding: 0 5px;
	box-sizing: border-box;
}
#pager li:last-child{
	border: none
}
#pager li a{
	display: block;
	width: 50px;
	height: 50px;
	line-height: 50px;
	transition: 0.3s;
	position: relative;
	color: #fff;
	background-color: #151515
}
#pager li.prev a,#pager li.next a{
	color: #B3B3B3;
	background-color: transparent
}
#pager li a:hover{
	background-color: #E0204D;
	color: #fff;
}
#pager li.prev a::before,#pager li.next a::before{
	width: 10px;
	height: 10px;
	border-top: solid 2px;
	border-right: solid 2px;
	top: 0;
	left: 0;
	bottom: 0;
	right: 5px;
	margin: auto;
	transform: rotate(45deg);
}
#pager li.prev a::before{
	right: 0;
	left: 5px;
	transform: rotate(-135deg);
}
#cate_list a:hover{
	transform: translateY(-5px)
}
.cate_title::before{
	width: 40px;
	height: 1px;
	background-color: #E0204D;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto
}

/***　page2　***/

.img_wrap .grid_6{
	width: -webkit-calc(50% - 5px)!important;
	width: calc(50% - 5px)!important;
}

/***　page4　***/

#page4 .box_title1::before{
	width: 20px;
	height: 1px;
	bottom: -1px;
	left: 0;
	background-color: #E0204D
}
#page4 .cate_txt1{
	top: -30px
}

/***　page5　***/

#page5 .cate_box:nth-child(even){
	flex-direction: row-reverse;
}
#page5 .cate_box::before{
	width: 0;
	height: 0;
	border-right: solid 20px transparent;
	border-bottom: solid 20px #0A0A0A;
	border-left: solid 20px transparent;
	transform: rotate(-45deg);
	top: -4px;
	left: -14px
}

/***　page6　***/

#page6 .box_title1{
	background-color: #212121;
	top: -10px;
	left: -10px;
	box-shadow: 0 0 10px rgba(0,0,0,0.2)
}
#page6 .cate_box{
	width: -webkit-calc(50% - 20px);
	width: calc(50% - 20px);
}
#page6 .cate_box:last-child{margin-bottom: 40px}
#page6 .box_txt1::before{
	top: 0;
	left: 20px;
	bottom: 20px;
	background-color: #E0204D;
	width: 1px
}

/***　page7　***/

#page7 .box_title1{z-index: 1;top: -10px}
#page7 .box_title1::before{
	top: -20px;
	right: -10px;
	left: -30px;
	bottom: 0;
	background-color: #E0204D;
	border-right: solid 2px #B3B3B3;
	z-index: -1;
	box-shadow: 0 0 10px rgba(0,0,0,0.2)
}
#page7 .box_title1::after{
	width: 0;
	height: 0;
	border-top: solid 7px transparent;
	border-left: solid 7px #6A0E24;
	border-bottom: solid 7px transparent;
	transform: rotate(-45deg);
	transform-origin: top left;
	left: -30px;
	bottom: -14px;
	z-index: -1
}
#page7 .cate_box:nth-child(even){
	flex-direction: row-reverse;
}
#page7 .cate_box:nth-child(even) .box_item.grid_6{
	padding-left: 0;
	padding-right: 20px
}
#page7 .cate_box .box_item.bg_color2{
	padding-bottom: 1px
}
#page7 .box_txt2::before,#page7 .box_txt2::after{
	width: 30px;
	height: 20px;
}
#page7 .box_txt2::before{
	border-top: solid 1px #6A0E24;
	border-left: solid 1px #6A0E24;
	top: 0;
	left: 0;
}
#page7 .box_txt2::after{
	border-bottom: solid 1px #6A0E24;
	border-right: solid 1px #6A0E24;
	bottom: 0;
	right: 0;
}

/***　page8　***/

#map{height: 300px}
.gmnoprint,.gm-control-active{
	display: none
}

/***　page9　***/

#page9 .tel_bt::before{
	height: 1px;
	width: 50%;
	left: 0;
	bottom: -1px;
	background-color: #E0204D
}
#page9 #form_bt input{
	cursor: pointer
}
#page9 #form_bt input:hover{
	transform: translateY(-5px)
}
#page9 #form_bt input:disabled{
	opacity: 0.4;
	cursor: auto
}
#page9 #form_bt input:disabled:hover{
	background-color: #151515;
	transform: translateY(0)
}
#page9 #privacy h3::before{
	width: 20px;
	height: 1px;
	bottom: -1px;
	left: 0;
	background-color: #E0204D
}

/***　page10　***/

#page10{line-height: 1.2}
#page10 a:hover{
	letter-spacing: 3px
}
#page10 a::before{
	height: 1px;
	width: 0;
	left: 0;
	bottom: -1px;
	background-color: #E0204D;
	transition: 0.5s;
}
#page10 a:hover::before{
	width: 100%
}

/***　IE対処　***/

@media all and (-ms-high-contrast:none) {
}

/* 文字間隔 */
/* default 1px */
.letter_0{letter-spacing: 0;}
.letter_1{letter-spacing: 0.11em;}
.letter_2{letter-spacing: 0.12em;}
.letter_3{letter-spacing: 0.13em;}
.letter_4{letter-spacing: 0.14em;}
.letter_5{letter-spacing: 0.15em;}
.letter_6{letter-spacing: 0.16em;}
.letter_7{letter-spacing: 0.17em;}
.letter_8{letter-spacing: 0.18em;}
.letter_9{letter-spacing: 0.19em;}
.letter_10{letter-spacing: 0.20em;}

.float_right{
	float: right
}
.float_left{
	float: left
}
.float_clear{
	float: none
}
.clearfix::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
/*ここからタブレット用（780px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 768px){

.more a,.more a:hover{background-color: #E0204D;color: #fff}
.more a::before{display: none}
header #header img{max-width: 250px}
header.schead #header img{max-width: 200px}
#contents .con_box figure{width: 85%;}
#contents .con_box .con_img1{
	left: -20%;
}
#contents .con_box .con_img2{
	right: -20%;
}
#top_staff figure{height: 170px;top: 0}
	
#page10 a{background-color: #E0204D}
#page10 a span{color: #fff}
#page10 a::before{display: none}
#pager li:not(.prev):not(.next){
	display: none;
}
#pager li.prev a,#pager li.next a{
	color: #fff;
	background-color: #1a1a1a
}
#page6 .cate_box{
	width: -webkit-calc(50% - 10px);
	width: calc(50% - 10px);
}
#page9 #form_bt input,#page9 #form_bt input:disabled:hover,#cate_list a{
	background-color: #E0204D
}

/* 文字間隔 */
/* default 1px */
.letter_0_tb{letter-spacing: 0;}
.letter_1_tb{letter-spacing: 0.11em;}
.letter_2_tb{letter-spacing: 0.12em;}
.letter_3_tb{letter-spacing: 0.13em;}
.letter_4_tb{letter-spacing: 0.14em;}
.letter_5_tb{letter-spacing: 0.15em;}
.letter_6_tb{letter-spacing: 0.16em;}
.letter_7_tb{letter-spacing: 0.17em;}
.letter_8_tb{letter-spacing: 0.18em;}
.letter_9_tb{letter-spacing: 0.19em;}
.letter_10_tb{letter-spacing: 0.20em;}

.float_right_tb{
	float: right
}
.float_left_tb{
	float: left
}
.float_clear_tb{
	float: none
}
.clearfix_tb::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
}

/*ここからスマホ用（750px以下）環境の設定
---------------------------------------------------------------------------*/
/*表示を切り替えるウィンドウサイズの指定*/
@media screen and (max-width: 667px){

.yoyaku_bt{
	top: 100px;
	right: -50px;
	transform: translateX(13px);
	width: 50px
}
.yoyaku_bt:hover{
	transform: translateX(0);
}
header #header img{max-width: 200px}
header.schead #header img{max-width: 150px}
#main_img::before{width: 100%;height: 100%;top: 0;left: 0;background-color: rgba(10,10,10,0.8);z-index: 1}
#main_img .main_box,.scrolldown{z-index: 1}
#top_blog .cate_box{width: 100%;}
	
#contents .con_box figure{width: 80%;top: 0;height: 150px}
#contents .con_box .con_img1{
	left: -10%;
	transform: skewX(10deg) translateY(0);
}
#contents .con_box .con_img2{
	right: -10%;
	transform: skewX(-10deg) translateY(0);
}
#contents .con_box h2{color: #fff}
#contents .con_box h2::before{
	width: 280px;
	height: 1px;
	bottom: 30px;
	right: auto;
	left: auto;
	background-color: #fff
}
#contents .con_box:first-child h2::before{right: 0}
#contents .con_box:last-child h2::before{left: 0}
	
#page4 .cate_txt1{
	top: -20px
}
#page5 .cate_box::before{
	border-right: solid 10px transparent;
	border-bottom: solid 10px #0A0A0A;
	border-left: solid 10px transparent;
	top: -2px;
	left: -7px
}
#page6 .cate_box{
	width: 100%;
}
#page7 .cate_box:nth-child(even) .box_item.grid_6{padding-right: 0}

/* 文字間隔 */
/* default 1px */
.letter_0_sp{letter-spacing: 0;}
.letter_1_sp{letter-spacing: 0.11em;}
.letter_2_sp{letter-spacing: 0.12em;}
.letter_3_sp{letter-spacing: 0.13em;}
.letter_4_sp{letter-spacing: 0.14em;}
.letter_5_sp{letter-spacing: 0.15em;}
.letter_6_sp{letter-spacing: 0.16em;}
.letter_7_sp{letter-spacing: 0.17em;}
.letter_8_sp{letter-spacing: 0.18em;}
.letter_9_sp{letter-spacing: 0.19em;}
.letter_10_sp{letter-spacing: 0.20em;}

.float_right_sp{
	float: right
}
.float_left_sp{
	float: left
}
.float_clear_sp{
	float: none
}
.clearfix_sp::after{
	clear:both;
	content:".";
	visibility:hidden;
	display:block;
	height:0;
}
}