@charset "UTF-8";

/* ---------------------

         　共通
		 
---------------------- */

*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

body{
  color: #333;
  background:#fff;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  font-size:16px;
  -webkit-font-smoothing: antialiased;
  padding: 0;
  margin: 0;
	position: relative;
  overflow-x:hidden;
  letter-spacing:1px;
  width:100%;
}

a{
	color:#333;
	text-decoration:none;
}

/* ---------------------

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

header{
	position:relative;
	z-index:1;
}

.nav_bar{
	width:1200px;
	max-width:1200px;
	margin:0 auto;
	height:75px;
	background:rgba(255,255,255,0.9);
}

.nav_bar_right, .nav_bar_left{
	display:inline-block;
	vertical-align:middle;
}

.nav_bar_left{
	width:300px;
}

.nav_bar_left img{ width: 300px;}

.nav_bar_left > a{
	font-size:24px;
	letter-spacing:2px;
}

.nav_bar_right{
	width:890px;
	text-align:right;
	font-weight:bold;
}

.gnav{
	border-bottom:#bd2e2e solid 5px;
}

.gnav, .gnav_etc{
	display:inline-block;
	vertical-align:middle;
}

.gnav ul{
}

.gnav ul li{
	display:inline-block;
	list-style:none;
	margin-right:20px;
}

.gnav_etc{
	margin-left:10px;
	margin-top:10px;
}

.gnav_etc > p{
	margin:0 0 10px;
	text-align:left;
}

.gnav_etc span{
	font-size:10px;
	border:#543e11 solid thin;
	padding:3px;
	margin-right:5px;
}

@media screen and (max-width: 1199px)  and (min-width:768px){
	.nav_bar, .nav_bar_left, .nav_bar_right{
		width: 100%;
		max-width: 100%;
		height:auto;
	}
		
	.nav_bar_left, .nav_bar_right{
		text-align:center;
	}
	.nav_bar_left{ margin-top: 30px;}
	
}

@media screen and (max-width: 767px) {
	.nav_bar, .nav_bar_left, .nav_bar_right{
		width: 100%;
		max-width: 100%;
		height:auto;
	}
		
	.nav_bar_left, .nav_bar_right{
		text-align:center;
	}
	
	.gnav ul{
		padding:0;
	}
	
	.gnav ul li{
		margin-right:10px;
	}
	
	.gnav ul li a{
		font-size:14px;
	}

	.gnav_etc{
		font-size:12px;
	}
	
	.gnav_etc > p{
		display:inline-block;
	}
}


/*----------------------------*/

#main_visual{
	height:600px;
	position: relative;
	width: 100%;
}

.main_img{
	background:url(../images/mainvisual.png) no-repeat;
	background-position:bottom right;
	height: 600px;
	z-index: -1;
}

.main_visual_box{
	width:80%;
	margin:0 auto;
	z-index: 1;
	margin-top: -500px;
	margin-left: 40px;
}

.main_visual_box h1{
	font-family: 'Timmana', sans-serif;
	color:#bd2e2e;
	font-size:100px;
	letter-spacing:0;
}

.main_visual_box h1 span{
	font-size:25px;
	display:block;
	letter-spacing: 4px;
    margin-top: 30px;
	font-style:italic;
}

@media screen and (max-width: 1199px)  and (min-width:768px){
	#main_visual{ height: 800px;}
	.main_img{
		height:860px;
		background-size: auto;
	}
	
	.main_visual_box{
		width:80%;
		margin-left: 30px;
		margin-top: -800px;
	}
}

@media screen and (max-width: 767px) {
	.main_img{
		height:620px;
		background-size: contain;
	}
	
	.main_visual_box{
		width:100%;
		margin-left: 0;
		padding-left: 30px;
		margin-top: -560px;
	}
	
	.main_visual_box h1{
		font-size:60px;
	}
	.main_visual_box h1 span{ letter-spacing: 2px; margin-top: 10px;}
}

/*----------------------------*/

#main_visual::after{
	content: "";
	background:url(../images/K.png) no-repeat;
	background-position:left;
	z-index:-1;
	height:600px;
	position:absolute;
    left: 0;
    top: 60px;
    width: 100%;
	}

@media screen and (max-width: 1199px)  and (min-width:768px){
	.bg_k{
		height:940px;
	}

}

@media screen and (max-width: 767px) {
	.bg_k{
		height:700px;
	}
}

/* ---------------------

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

footer{
	text-align:center;
	font-size:12px;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
	padding: 100px 0 20px;
	border-bottom:#bd2e2e solid 5px;
}

@media screen and (max-width: 1200px){
	footer{ margin-top: 100px;}
}


/* ---------------------

         　パーツ
		 
---------------------- */

.text_center{
	text-align:center;
}

@media screen and (max-width: 767px) {
.text_center{
	line-height:1.5em;
}
}

/*　Animate
====================================*/

.animate{
	opacity: 0;
	transition: all .5s ease;
}

.animate.show{
	opacity: 1;
	transform: none;
}

.animate_up{
	transform: translate(0, 100px);
}

.animate_lr{
	transform: translate(-100px, 0);
}

.animate_rl {
  transform: translate(100px, 0);
}