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

/* basic setting:
--------------------------------------------*/

body {
	line-height: 1.4em;
}

.pc {display: none !important;}
.sp {display: block !important;}


/* outline setting :
--------------------------------------------*/

.outline {
/*	width:100%;*/
	padding:0%
}


/* header setting :
--------------------------------------------*/

#header_l{
	width: 80%;
	margin: 0;
	
}

header{
    border-bottom: solid 2px #FFEABD;
    position: relative;
}

/*===============================================================
   ナビゲーション設定ここから
===============================================================*/

/*==== グローバルナビゲーション ====*/

#wrap_sp{
	background: rgba(255,255,255,0.95);
	display: none;
    width: 100%;
    box-sizing: border-box;
	position: absolute;
	z-index: 1000;
    box-shadow:1px 5px 20px 1px rgba(150,150,150,0.3);
}

#wrap_sp #header_r{
	float: none;
	text-align: center;
	z-index: 1000;
	padding: 1% 0 10%;
	display: block;
	background: #EEE;
	margin-top: 0;
	width: 100%;
}

#wrap_sp #header_r p{
	float: none;
	text-align: center;
	z-index: 1000;
	padding: 1%;
	display: block;
	background: #EEE;
}

/*大カテゴリー*/

#glnav li a {
	width: 100%!important;
	padding: 2.5%;
	float: none;
	text-align: left;
	border-bottom: 1px solid #ccc;
}

#glnav li a span{
	text-align:left;
	font-size:100%;
	padding:1em 1em 1em 5em;
}


/*メガメニュー背景デフォルト*/
#glnav li#gl1 > a span{background: url(../img/common/gl1.png) no-repeat 15px center; }
#glnav li#gl2 > a span{background: url(../img/common/gl2.png) no-repeat 15px center;}
#glnav li#gl3 > a span{background: url(../img/common/gl3.png) no-repeat 15px center;}
#glnav li#gl4 > a span{background: url(../img/common/gl4.png) no-repeat 15px center;}
#glnav li#gl5 > a span{background: url(../img/common/gl5.png) no-repeat 15px center;}
#glnav li#gl6 > a span{background: url(../img/common/gl6.png) no-repeat 15px center;}



#glnav > ul > li#gl1 > a,
#glnav > ul > li#gl2 > a,
#glnav > ul > li#gl3 > a,
#glnav > ul > li#gl4 > a,
#glnav > ul > li#gl5 > a,
#glnav > ul > li#gl6 > a{
	background: none;
}

#glnav li#gl1>a:hover,
#glnav li#gl2>a:hover,
#glnav li#gl3>a:hover,
#glnav li#gl4>a:hover,
#glnav li#gl5>a:hover,
#glnav li#gl6>a:hover{
	background: none;
}

/*-- menu --*/

.menu {
	display: block;
	position: absolute;
	top: 8px;
	right: 0;
}

#open_close{
	display: inline-block;
	position: relative;
	width: 60px;
	padding-bottom: 5em;
	margin: 0px 0 10px;
	background: #fcaa00;
}


#open_close_btn{
	content: "MENU";
	display: block;
	position: absolute;
	top: 35%;
	left: 43%;
	width: 30px;
	height: 3px;
	margin: -1px 0 0 -10px;
	background: #FFF;
	transition: .2s;
/*    border-radius: 5px*/
}

#open_close_btn:before, #open_close_btn:after{
/*	content: "MENU";*/
	display: block;
	content: "";
	position: absolute;
	top: 40%;
	left: 0;
	width: 30px;
	height: 3px;
	background: #FFF;
	transition: .3s;
}

#open_close_btn:before{
	margin-top: -13px;
}
#open_close_btn:after{
	margin-top: 10px;
}
#open_close .close{
	background: transparent;
}
#open_close .close:before, #open_close .close:after{
	margin-top: 0;
}
#open_close .close:before{
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
}
#open_close .close:after{
	transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
}



/*

.menu_btn {
	display: block;
	position: fixed;
	top: 0;
	right:0;
	z-index: 1000;
}

.menu_btn a,
.menu_btn a:hover{
	display: block;
	text-decoration:none!important;
}
.menu_btn .txt_close,
.menu_btn .txt_menu{
	display:block;
	padding: 32px 10px 10px;
	color:#333;
	font-weight:bold;
	font-size:85%;
}

.menu_btn.mini .txt_close,
.menu_btn.mini .txt_menu{
	padding: 22px 10px 10px;
	font-size:80%;
}

.menu_btn .txt_close {
	display:none;
}
#open_close.on .txt_close{
	display: block;
}
#open_close.on .txt_menu{
	display: none;
}

#open_close.on{
	background: #E0E0E0
}

#open_close_btn{
	display: block;
	position: absolute;
	top: 1.2em;
	left: 1.2em;
	width: 20px;
	height: 2px;
	background: #333;
	transition: .2s;
}

.menu_btn.mini #open_close_btn{
	top: 0.9em;
}

#open_close_btn:before, #open_close_btn:after{
	display: block;
	content: "";
	position: absolute;
	top: 60%;
	left: 0;
	width: 20px;
	height: 2px;
	background: #333;
	transition: .3s;
}

#open_close_btn:before{
  margin-top: -7px;
}
#open_close_btn:after{
  margin-top: 5px;
}
#open_close .close{
  background: transparent;
}
#open_close .close:before, #open_close .close:after{
  margin-top: 0;
}
#open_close .close:before{
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
#open_close .close:after{
  transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
}
*/





/* footer setting :
--------------------------------------------*/
#pagetop img {
	width:30px;
}

#footer{padding-top: 2em;}


#footer #copy {
	padding: 1em 1em 2em;
	font-size:80%;
}






/* frexible setting :
--------------------------------------------*/
#contents.grid_3_4,
#right_col.grid_1_4 { 
	display: block;
	float: none;
	margin-left: 0;
	width: auto;
}

.off .grid_3_5,
.off .grid_1_5,
.off .grid_1_12,
.off .grid_1_6,
.off .grid_1_4,
.off .grid_1_3,
.off .grid_5_12,
.off .grid_1_2,
.off .grid_7_12,
.off .grid_2_3,
.off .grid_3_4,
.off .grid_5_6,
.off .grid_4_5,
.off .grid_11_12,
.off .grid_1_1,
.off .grid_1_2_center{ 
	display: block;
	float: none;
	margin-left: 0;
}

.off .grid_3_5,
.off .grid_1_5,
.off .grid_1_12,
.off .grid_1_6,
.off .grid_1_4,
.off .grid_1_3,
.off .grid_5_12,
.off .grid_1_2,
.off .grid_7_12,
.off .grid_2_3,
.off .grid_3_4,
.off .grid_5_6,
.off .grid_4_5,
.off .grid_11_12,
.off .grid_1_1,
.off .grid_1_2_center { width: auto; }

.mgb0_pc {margin-bottom: 1.5em !important;}



/* link setting :
--------------------------------------------*/

.lnk1 a{
    box-shadow:1px 3px 10px 1px rgba(150,150,150,0.2);
}


/* 吹き出し */

.speak{
    padding: 1.5em;
}

.speak:before {
    content: "";
    position: absolute;
    top: -24px;
    left: 50%;
    margin-top: -24px;
    border: 15px solid transparent;
    border-bottom: 45px solid #FFF;
}