@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700);
@import url(http://fonts.googleapis.com/css?family=Glegoo);
@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro);
@import url(http://fonts.googleapis.com/css?family=Lora);

body *{
  font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro W3','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Helvetica,Arial,sans-serif;
  color: #333;
  margin: 0;
  padding:0;
  font-size: 16px;
}

body,
h1,h2,h3,h4,h5,
ol,ul,li,dl,dd,
address,
div,img{
	margin		: 0;
	padding		: 0;
	}

ol,ul,li,
dl,dd{
	list-style	: none;
	}
img{
	font-size: 0;
	line-height: 0;
	vertical-align: bottom;
}

p{
	line-height: 1.6;
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	list-style-type: none;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* link
================================================== */
a {
	text-decoration: none;
	outline:none;
	color:#5C5B5C;
	}

a:hover {  
	color		: #5C5B5C;
	text-decoration	: none;
	}

/* header_box
-------------------------------------------------- */
.header_box {
	width:1000px;
	height:130px;
	box-sizing: border-box;
	padding:0;
	background: #FFF;
	-webkit-border-bottom-left-radius:7px;
	-moz-border-bottom-left-radius:7px;
	border-bottom-left-radius:7px;
	-webkit-border-bottom-right-radius:7px;
	-moz-border-bottom-right-radius:7px;
	border-bottom-right-radius:7px;
	-moz-box-shadow: 0 2px 5px #333;
	-webkit-box-shadow: 0 2px 5px #333;
	box-shadow: 0 2px 5px #333;
	position: absolute;
	top:0;
	left:50%;
	z-index:3;
	margin-left:-500px;
}


@media screen and (max-width: 800px) {
.header_box {
	width:100%;
	height:85px;
	position: fixed;
	margin:0 0 2%;
	-webkit-border-bottom-left-radius:0px;
	-moz-border-bottom-left-radius:0px;
	border-bottom-left-radius:0px;
	-webkit-border-bottom-right-radius:0px;
	-moz-border-bottom-right-radius:0px;
	border-bottom-right-radius:0px;
	border-bottom:3px solid #17658D;
	left:0%;
	margin-left:0;
}
}

@media screen and (max-width: 568px) {
.header_box {
	height:65px;
}
}

.h_logo{
	width:auto;
	height:110px;
	float:left;
	margin:10px 10px 0 20px;
}

@media screen and (max-width: 800px) {
.h_logo{
	width:50%;
	height:55px;
	float:left;
	margin:5px 0 5px 0;
}
}

@media screen and (max-width: 568px) {
.h_logo{
	width:70%;
	margin:3px 0 3px 0;
}
}

.h_logo img{
	width:auto;
	height:60px;
	margin-bottom:7px;
}


@media screen and (max-width: 800px) {
.h_logo img{
	height:50px;
	margin-left:3%;
	margin-bottom:3px;
}
}

@media screen and (max-width: 568px) {
.h_logo img{
	height:36px;
	margin-bottom:4px;
}
.h_logo p a{font-size:11px; color:#FFF;padding:0 10px 0 10px;background-color:#108DBB;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.h_logo p a:hover{color:#FFF;text-decoration:none;background-color:#0A579A;}
}

.h_logo p{
	font-size:0.8em;
	width:100%;
	text-align: center;
	line-height:1.4;
}

.h_logo span{
	font-size:1.2em;
}

@media screen and (max-width: 800px) {
.h_logo p{
	clear:both;
	text-align: left;
	margin-left:20px;
	font-size:0.7em;
}
}


@media screen and (max-width: 568px) {
.h_logo p{
	margin-left:30px;
}
}

.header_box ul{
	float: right;
	width: auto;
	height:130px;
	margin:0 0.5% 0 0;
}

@media screen and (max-width: 800px) {
.header_box ul{
	display:none;
}
}

.header_box ul li{
	display: table;
	text-align: center;
	float: left;
	width: auto;
	height:130px;
	overflow: hidden;
	line-height: 1.4;
	border-left:0.05em solid #f5f5f5;
}

.header_box ul li p{
	text-align: center;
}

.header_box ul li img{
	height:50px;
	width:auto;
	margin-bottom:5px;
}

.header_box ul li a{
	padding: 10px 20px 20px;
	height:100px;
	text-decoration: none;
	vertical-align: middle;
	color:#696969;
	display:block;
}

.header_box ul li a .la{
	color:#3592B9;
}

.header_box ul li a .sm{
	color: #a9a9a9;
}

.header_box ul li a:hover{
	text-decoration: none;
	background:#10A1DD;
}

.header_box ul li a:hover .la{
	color: #FFF;
}

.header_box ul li a:hover .sm{
	color: #FFF;
}

.header_box ul li a.sched {
	background:#10A1DD;
	color: #FFF!important;
}

.header_box ul li a.sched .la{
	color: #FFF!important;
}

.header_box ul li a.sched  .sm{
	color: #FFF!important;
}

.header_box ul li .la{
	font-family: 'Noto Sans Japanese', sans-serif;
	font-weight:500;
	letter-spacing:0em;
	font-size:14px;
}

@media screen and (max-width: 1280px) {
.header_box ul li .la{
	font-size:13px;
	letter-spacing:0em;
	
}
}

.header_box ul li .sm{
	font-size:14px;
	font-family: 'Source Sans Pro', sans-serif;
	font-weight: 400;
	letter-spacing:0.02em;
}

/* menu
 * --------------------------------------- */
/* global_nav */
#g_nav{
	width:100%;
    background: rgba(25, 25, 112, 0.8);
	color: #FFF;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 90;
}

.navi{
	margin:0 auto;
	font-size:0.9em;
}

#g_nav .nb{
    float:left;
	padding:15px 5px 15px 30px;
	text-align: center;
	display: block;
	line-height:1;
	font-size:12px;
	letter-spacing:0.05em;
	color: #FFF;
}

@media screen and (max-width: 1280px) {
#g_nav .nb{
    float:left;
	padding:15px 0 15px 20px;
	text-align: center;
	display: block;
	line-height:1;
	font-size:12px;
	letter-spacing:0.05em;
	color: #FFF;
}
}

#g_nav .lg{
    float:left;
	padding:2px 20px 3px 30px;
	display: block;
	line-height:1;
}

#g_nav .lg img{
    width: 178px;
	height: 42px;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10000;
}

#g_nav a {
	color: #FFF;
	font-size:13px;
	text-decoration: none;
	}

#g_nav a:hover {  
	color: #9D9D9D;
	text-decoration	: none;
	}

.navi li {
	float: left;
	display: block;
	line-height: 0;
	cursor: pointer;
}

@media screen and (max-width: 800px) {
.nb{
	display:none!important;
}
.icon{
	display:none!important;
}
}

/* headbar
 * --------------------------------------- */
#headbar {
	width: 1200px;
	margin:0 auto;
	}

@media screen and (max-width: 1280px) {
#headbar {
	width: 100%;
	}
}

#headbar ul,
#headbar p {
	margin: 0;
	padding: 0;
	}

#headbar ul li {
	float: left;
	list-style-type: none;
	}

#headbar ul li a {
	display: block;
	text-align: center;
	}

@media screen and (max-width: 800px) {
#headbar{
	display:none;
}
}

/* menu
 * --------------------------------------- */
.menu li {
	display:inline-block;
	margin: 8px;
	color: #000;
	background:#fff;
	background: rgba(255,255,255, 0.5);
	-webkit-border-radius: 10px;
            border-radius: 10px;
}
.menu li.active{
	background:#666;
	background: rgba(0,0,0, 0.5);
	color: #fff;
}
.menu li a{
	text-decoration:none;
	color: #000;
}
.menu li.active a:hover{
	color: #000;
}
.menu li:hover{
	background: rgba(255,255,255, 0.8);
}
.menu li a,
.menu li.active a{
	padding: 9px 18px;
	display:block;
}
.menu li.active a{
	color: #fff;
}

/* slicknav */
ul#menu_sp {
	display: none;
}
.slicknav_menu {
	display:none;
}

@media screen and (max-width: 800px) {
.menu {
	display: none;
}
.slicknav_menu {
    display:block;
    z-index: 100;
}

nav#global_nav {
	display: block;
	margin: 0;
	padding: 0;
	border-top: none;
	border-bottom: none;
}
}

/* .contents
-------------------------------------------------- */
#contents {
	width:100%;
	margin:0 auto;
	position:relative;
	background: url("../images/common/bg.gif");
}

#containter{
	width:100%;
	margin:0 auto;
	position:relative;
}

.bg_mk{
	background: url("../images/common/bg.gif");
}

/* .page
-------------------------------------------------- */
#page {
	width: 1260px;
	margin: 0 auto 0;
    letter-spacing	: 0.05em;
	line-height: 1.6;
	padding-top:140px;
	z-index: 0;
	position:relative;
}

@media only screen and  (max-width: 1280px) {
	#page {
		width: 1000px;
		}
}

@media screen and (max-width: 800px) {
  #page {
    width: 100%;
	padding-top:100px;
}
}

/* .page2
-------------------------------------------------- */
#page2 {
	width: 1260px;
	margin: 0 auto 0;
    letter-spacing	: 0.05em;
	line-height: 1.6;
	z-index: 0;
	position:relative;
}

@media only screen and  (max-width: 1280px) {
	#page2 {
		width: 1000px;
		}
}

@media screen and (max-width: 800px) {
  #page2 {
    width: 100%;
	padding-top:100px;
}
}

.p_navi{
	width: 99%;
	max-width:950px;
	text-align: left;
	font-size :0.7em;
	letter-spacing	: 0.05em;
	font-weight:400;
	padding:1% 0 0 1%;
	margin:0 auto;
	color:#FFF;
	}

.p_navi span {
	color: #FFF;
	}
	
.p_navi a {
	color: #FFF;
	font-size :1em;
	font-weight:400;
	text-decoration: none;
	}

.p_navi a:hover {  
	color: #FAF3E2;
	text-decoration: none;
	}

@media screen and (max-width: 800px) {
  .p_navi{display:none;}
	}

.p_navi2{
	width: 99%;
	max-width:950px;
	text-align: left;
	font-size :0.7em;
	letter-spacing	: 0.05em;
	font-weight:400;
	padding:1% 0 0 1%;
	margin:0 auto;
	color:#333;
	}

.p_navi2 span {
	color: #333;
	}
	
.p_navi2 a {
	color: #333;
	font-size :1em;
	font-weight:400;
	text-decoration: none;
	}

.p_navi2 a:hover {  
	color: #FAF3E2;
	text-decoration: none;
	}

@media screen and (max-width: 800px) {
  .p_navi2{display:none;}
}
	
#wrapper {
	width: 96%;
	margin:0 auto;
	padding: 2% 0;
	max-width:1200px;
}

@media screen and (max-width: 1280px) {
#wrapper {
	width: 96%;
}
}

@media screen and (max-width: 800px) {
#wrapper {
	width: 98%;
	padding:0 1%;
}
}

@media screen and (max-width: 568px) {
#wrapper {
	width: 96%;
	padding:0 2%;
}
}

#wrapper:after {
	content: "";
	clear: both;
	display: block;
}

#sub_contents {
	width: 1260px;
	margin: 0 auto 0;
    letter-spacing	: 0.05em;
	line-height: 1.6;
	padding:3% 0;
}

@media only screen and  (max-width: 1280px) {
	#sub_contents {
		width: 1000px;
		}
}

@media screen and (max-width: 800px) {
  #sub_contents {
    width: 100%;
}
}

#sub_contents:after {
	content: "";
	clear: both;
	display: block;
}

.section {}
.bg_blue {background: url("../images/common/bg.gif");}
.gray2 {background:#AFBF74;}
.wht {background:#FFF;}

/* #side_navi
--------------------------------------------------------- */
#side_navi{
width:32px;
padding:7px 10px 3px 8px;
height:auto;
position:fixed;
top:175px;
right:0;
background: rgba(81, 53, 4, 0.8);
z-index: 110;
}

@media screen and (max-width: 800px) {
#side_navi{
display:none;
}
}

#side_navi li:hover {
	filter:alpha(opacity=80);  /* for IE */
	-moz-opacity: 0.8;  /* for Firefox */
	opacity: 0.8;  /* for Safari or Opera */
}

#side_navi #tab1{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab2{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab21{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab3{
width:35px;
height:38px;
position:relative;
margin-bottom:2px;
}


/* footer
---------------------------------------------------------------------------*/
footer {
	width:100%;
	margin:0 auto 0;
	height:auto;
	float:left;
	background:#10A1DD;
	color:#FFF;
}

.f_top{
	margin:0 auto 0;
	width:350px;
	text-align: center;
	border-bottom:1px solid #FFF;
	line-height:1;
	padding-bottom:1%;
	padding-top:2%;
}

@media screen and (max-width: 568px) {
.f_top{
	width:90%;
}
}

.f_top img{
	width:90px;
	height:auto;
	margin-bottom:10px;
}


.f_top p{
	font-size:1.4em;
	color:#FFF;
	text-align: center;
}


.f_shop{
	margin:2% auto 2%;
	clear:both;
	text-align: center;
	width:100%;
	line-height:1.8;
}

.f_shop strong{
	font-weight:400;
	font-size:1.3em;
	color:#FFF;
}

.f_shop p{
	font-weight:400;
	color:#FFF;
}

.f_shop a {
	color: #FFF;
	text-decoration: underline;
	}

.f_shop a:hover {  
	color: #FFF;
	text-decoration	: none;
	}

.copy{
	margin:3% auto 1%;
	clear:both;
	text-align: center;
	width:100%;
	color:#FFF;
}


.copy p{
	font-size:0.8em;
	font-weight:300;
	color:#FFF;
}

.f_menu{
	margin:3% auto 0;
	width:100%;
}

.f_menu p{
	text-align: center;
}

.f_menu span{
	margin:0 1%;
}

@media screen and (max-width: 720px) {
.f_menu{
	margin:3% auto 0;
	width:94%;
}
.page_top span{
	font-size:300%;
}
}

@media screen and (max-width: 568px) {
.f_menu span{
	margin:2% 4% 2% 4%;
	font-size:0.9em;
	line-height:2;
}
}

.page_top a {
	color: #FFF;
	text-decoration: none;
	}

.page_top a:hover {  
	color: #FAF3E2;
	text-decoration: none;
	}

.f_menu a {
	color: #FFF;
	text-decoration: underline;
	}

.f_menu a:hover {  
	color: #FAF3E2;
	text-decoration: none;
	}

.f_icon{  
	margin:25px auto 25px;
	display: block;
	width:280px;
	clear:both;
	} 

.f_icon li{
	margin:0 5px 15px 10px;
	float:left;
}

.f_icon li img{
	width:40px;
}

@media only screen and  (max-width: 568px) {
.f_icon{
	width:96%;
	display: block;
}	
.f_icon li{
	width:14%;
	margin:0 3% 15px;
	float:left;
}

.f_icon li img{
	width:100%;
}
}

.overimg:hover img {
	filter:alpha (opacity=70);
	-moz-opacity:0.80;
	opacity:0.80;
}

/* page_top
========================================================================== */
#page_top {
position: fixed;
bottom: 1.8%;
right: 1.5%;
z-index:2000;
}

/* .line
-------------------------------------------------- */
hr {
	display		: none;
	}
	
.clr {
	height		: 0;
	clear		: both;
	}
	
.pcHide{display: none;}

/*---------------------------------PC---------------------------------------*/
@media screen and (max-width: 1280px) {
#text {
	width: 100%;
	padding-left:2%;
	padding-right:2%;
	box-sizing: border-box;
}

#text2 {
	width: 100%;
	padding-left:2%;
	padding-right:2%;
	box-sizing: border-box;
}

#text3 {
	width: 100%;
	padding-left:2%;
	padding-right:2%;
	box-sizing: border-box;
}
}

/*---------------------------------タブレット---------------------------------------*/
@media screen and (max-width: 800px) {
.pcHide{display: block;}
.tbHide{display: none;}
}

/*---------------------------------スマホ---------------------------------------*/
@media screen and (max-width: 568px) {
.pcHide{display: block;}
.spHide{display: none;}
}

/* #side_navi
--------------------------------------------------------- */
#side_navi{
width:32px;
padding:7px 10px 3px 8px;
height:auto;
position:fixed;
top:175px;
right:0;
background: rgba(2, 80, 106, 0.8);
z-index: 110;
}

@media screen and (max-width: 800px) {
#side_navi{
display:none;
}
}

#side_navi li:hover {
	filter:alpha(opacity=80);  /* for IE */
	-moz-opacity: 0.8;  /* for Firefox */
	opacity: 0.8;  /* for Safari or Opera */
}

#side_navi #tab1{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab2{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab3{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab4{
width:35px;
height:38px;
position:relative;
margin-bottom:5px;
}

#side_navi #tab5{
width:35px;
height:35px;
position:relative;
margin-bottom:5px;
}