/* CSS Document */
/* ##################################################################### */
/*	EyewillStrap Ver.1.0
/* ##################################################################### */
/* ===================================================================== */
/*	スマホ基本設定
/* ===================================================================== */
body{padding-top: 80px;
}

/* --　★★スマホロゴマーク  --*/
.navbar-brand{
	margin-top:10px;
	width: 220px;
	height: 45px;
	background-image: url(../images/logo_sm.png);
	background-size: contain;
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	float: left;
	padding-left:0px;
	margin-left:-15px;
	}


/* ===================================================================== */
/*	★★スマホヘッダーの色を変更
/* ===================================================================== */
.navbar-default {
	background-color: transparent;
	background-image: url(../images/bg_top.png);
	background-repeat: repeat-x;
}

/* --　★★スマホ　グローバルナビのBGカラー アンダーラインカラー */
.navbar-inverse {
	background-color: #ffffff;
	border-color: #333333;
	margin-bottom:30px;
}


/* --　★★ハンバーガー　三本線 */
.navbar-inverse .navbar-toggle .icon-bar{
	margin-left: 8px;
	background-color: #000000;
	}

/* --　★★スマホ　ハンバーガー「メニュー」の文字 */
.humberger{
	font-size: 55%;
	color: #000000;
	}

/* --　★★スマホ　ハンバーガーOPENした時の文字のアンダーライン */
.navbar-inverse .collapse li{
	border-bottom: 1px dotted #B7B7B7;
	}

/* --　★★スマホ　ハンバーガーOPEN HoverしたときのTEXTカラー */
.navbar-inverse a:hover, .navbar-brand a:hover{
	color: #009BFF!important;
}

/* --　★★スマホ　ハンバーガー 下階層 Openしたときの文字とBGカラー */
.navbar-inverse .navbar-nav > .open > a:focus {
	color: #fff;
	background-color: #000000;
}



/* --　★★スマホ　ハンバーガー枠 */
.navbar-inverse .navbar-toggle {
	text-align: center;
	padding-top: 0px;
	background-color: #ffffff;
}


/* --　★★スマホ　ハンバーガーBGカラー */	
.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
  background-color: #fff;
}

.navbar-fixed-bottom {
  margin-bottom: 50px;
}

/*.navbar-inverse .navbar-toggle {
	border-color: #FF000000;
}*/

/*.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
  border-color: #FF000000;
}*/

/* --　★★スマホ　ハンバーガーCloseボタン */
.navbar-inverse .navbar-nav > li.closeX > a:hover,
.navbar-inverse .navbar-nav > li.closeX > a:focus {
  background-color: #ffffff!important;
}
	
.navbar-inverse .navbar-nav li.closeX,.navbar-inverse .navbar-nav li.logout{
	background-color: #ffffff!important;
	color:#494949!important;
	font-size:80%;
	}
	
.navbar-inverse .navbar-nav li.closeX a:link,.navbar-inverse .navbar-nav li.logout a:link{
	padding-top: 5px!important;
	padding-bottom: 5px!important;
	background-color: #ffffff!important;
	color: #000000!important;
	}
/* ===================================================================== */
/*	スマホ　ローカルナビゲーション
/* ===================================================================== */

#localNav {
	clear: both;
	float: left;
	margin-left: 0px;
	width: 100%;
	display: block;
	margin-top: 20px;
}


#localNav p {
	background-repeat: no-repeat;
	background-position: 98% center;
	color: #FFF;
	font-size: 130%;
	display: block;
	font-style: normal;
	font-variant: normal;
	text-decoration: none;
	padding-left: 10px;
	background-color: #000000;
	background-image: url(../images/arrow_orange_down.png);
}


/* 見出しデザイン　リボン */
.h_ribon p {
	position: relative;
	padding: .10em 1em;
	margin-bottom:15px;
}
.h_ribon p::before,
.h_ribon p::after {
	content: '';
	position: absolute;
	border-style: solid;
	border-color: transparent;
}
.h_ribon p::before {
	top: 100%;
	left: 0;
	border-width: 0 15px 15px 0;
	border-right-color: #ccc;
}




#localNav p a:hover{
	color: #E1E1E1;	
	}

#localNav h2 a{
	padding-top:5px;
	padding-bottom:5px;
	color: #FFF;
	display: block;
	text-decoration: none;
	}
#localNav h2 span a{
	padding-left:15px;
	}

#localNav a:hover img{
	opacity: 0.9;
	filter: alpha(opacity=90);
	}

#localNav ul {
	margin-left:0px;
	padding-left:0px;
	
}

#localNav li {
	float: left;
	list-style-type: none;
	width: 100%;
	border: 1px dotted #646464;
	display: block;
	box-sizing: border-box;
	text-decoration: none;
	margin-bottom: 3px;
	border-radius: 5px;
	-webkit-border-radius: 5px;    /* Safari,Google Chrome用 */
	-moz-border-radius: 5px;   /* Firefox用 */
	background-color: #DDDDDD;
	background-image: -webkit-linear-gradient(270deg,rgba(237,237,237,1.00) 0%,rgba(248,248,248,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(237,237,237,1.00) 0%,rgba(248,248,248,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(237,237,237,1.00) 0%,rgba(248,248,248,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(237,237,237,1.00) 0%,rgba(248,248,248,1.00) 100%);
}

#localNav li:hover {
	background-color: #DDDDDD;
	background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(228,228,228,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(228,228,228,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(228,228,228,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(255,255,255,1.00) 0%,rgba(228,228,228,1.00) 100%);
}


#localNav li a{
	color: #000000;
	padding-top: 8px;
	padding-bottom: 8px;
	display: block;
	background-image: url(../images/arrow_orange.png);
	background-position: right 5px;
	background-repeat: no-repeat;
	text-decoration: none;
	padding-left: 10px;
}

#localNav li.subcat {
	list-style-type: none;
	width: 100%;
	display: block;
	text-decoration: none;
	margin-bottom: 3px;
	border-style: none;
}
#localNav li.subcat a{
	width: 100%;
	color: #000000;
	padding-top: 4px;
	padding-bottom: 4px;
	display: block;
	text-decoration: none;
	background-image: url(../images/arrow_orange.png);
	background-position: left -1px;
	padding-left:20px;
}

#localNav li a:hover{
	background-color: transparent;
	color: #000000;
	}

#localNav li span a{
	padding-left:15px;} 

#localNav li a img{
	width:100%;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px!important;
	}

#localNav li.on a {
	color: #FFFFFF;
	background-color: #6592CF;
	background-image: url(../images/arrow_orange.png);
}

#localNav li span a:hover{
	padding-left: 15px;
	background-color: #FF0009;
	color: #FFFFFF;
	}

/* ===================================================================== */
/*	スマホフッター
/* ===================================================================== */
footer{
	background-color: #434343;
	padding-top: 25px;
	padding-bottom: 15px;
	color: #E5E5E5;
	}

footer p{
	font-size: 74%;
	}
	
footer.liYoko{
	width: 100%;
	float: left;
	}

footer .liYoko ul{
	margin-bottom: 25px;
	padding-left: 0px;
	width: 100%;
	float: left;
	display: block;
	}

footer .liYoko li{
	float: left;
	text-decoration: none;
	list-style-type: none;
	border: 1px solid #3D3D3D;
	width: 50%;
	display: block;
	background-color: #000000;
	padding-top: 10px;
	padding-bottom: 8px;
	text-align: center;
	font-size: 80%;
	}

footer .liYoko li a:hover{
	color: #E5E5E5;	
	}
	
footer nav{
	padding-top: 15px;
	background-color: #000000;
	width: 100%;
	float: left;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 15px;
	background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,0.48) 0%,rgba(0,0,0,0.54) 100%);
	background-image: linear-gradient(180deg,rgba(0,0,0,0.48) 0%,rgba(0,0,0,0.54) 100%);
	background-color: transparent;
	font-size: 80%;
	}
	
footer nav dl{
	float: left;
	width:100%;
	}

footer nav dt{
	color: #E7E7E7;
}

footer nav dd{
	padding-left: 0px;
	border-bottom: 1px solid #676767;
}
footer nav dd a{
	display: block;
	color: #D1CECE;
	}
footer .home{
	}
footer .home p{
	width: 100%;
	padding-bottom:10px;
	padding-top:10px;
	text-align: center;
	display: block;
	background-color: #222222;
	clear: left;
}

footer address{
	width: 100%;
	float: left;
	padding-left:20px;
}

footer nav dt{
	font-size: 120%;
	margin-bottom:5px;
	}

footer nav dd{
	font-size: 100%;
	line-height: 1.8em;
	}

footer nav dd a:hover{
	color: #DCE6FF;
	}

.container.headerArea{
	display: block;
	float: left;
	width:167px;
	}

.primaryArea{
	display: none;
	}


/* ===================================================================== */
/*   共通のスタイル　パンくずリスト
/* ===================================================================== */
.container .breadCrumb {
	float: left;
	margin-bottom: 5px;
	width: 100%;
	margin-top: 10px;
}

.container .breadCrumb ul{
	padding-left: 0px;
	padding-bottom:0px;
	list-style-type: none!important
	}

.container .breadCrumb li {
	float: left;
	margin-right: 10px;
	background-image: url(../images/breadcrumbs_marker.png);
	background-repeat: no-repeat;
	background-position: 0px 50%;
	padding-left: 10px;
	padding-bottom: 0px;
	list-style-type: none!important;
	font-size: 10px;
}
.container  .breadCrumb li a{
	text-decoration: none;
	list-style-type: none!important;
	}
.container .breadCrumb li.list01 {
	margin-left: 5px;
	list-style-type: none!important;
	background-image: none;
}

.container  .breadCrumb li a:hover{
	color: #31BD00;
	}




/*-- TOPへ戻る ------------------------*/
.pageTop {
	display:none;
	position:relative;
}
.pageTop a {
	position: fixed;
	display: block;
	width: 21px;
	height: 21px;
	background: url(../images/return.png) no-repeat center top;
	text-indent: -9999px;
	right: 10px;
	margin-bottom:70px;
}
.pageTop:hover {  
    opacity: 0.4;  
    filter: alpha(opacity=60);  
}

#localNav .bannerArea ul{
	background-color: transparent;
	}

#localNav .bannerArea ul li{
	background-color: transparent;
	background-image: none;
	border-style: none;
	width:50%;
	height:auto;
	}
	
#localNav .bannerArea ul li img{
	height:auto!important;
	}

/* ===================================================================== */
/*	スマホ　サブグローバルナビゲーション
/* ===================================================================== */

.globalNaviSub {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	margin-bottom: 15px;
}
.globalNaviSub ul {
 width:100%;
	padding-left: 0px;
}
.globalNaviSub li {
	list-style-type: none;
	width: 49.367%;
	display: block;
	vertical-align: middle;
	float: left;
	background-color: #1683F7;
	margin-bottom: 5px;
	color: #fffdf6;
	background-image: url(../images/arrow_yellow.png);
	background-repeat: no-repeat;
	background-position: right;
}

.globalNaviSub li a span{

	}

.globalNaviSub li a {
	display: block;
	color: #fffdf6;
	text-decoration: none;
}

.globalNaviSub li:hover{
	background-color: #409BFC;
	}

.globalNaviSub div {
	border: 1px solid #999;
	padding-top: 8px;
	padding-bottom: 8px;
	text-indent: 3%;
}
.globalNaviSub li.odd {
	margin-left: 0;
}
.globalNaviSub li.even {
	margin-left: 1.2658%;
}


@media (min-width: 768px) {
/* ##################################################################### */
/*	タブレット
/* ##################################################################### */
/* ===================================================================== */
/*	タブレット 基本設定
/* ===================================================================== */

body{padding-top: 120px;}

li.logout,li.closeX, .navbar-nav li.list00, .navbar-nav li.list09, .navbar-nav li.list10 {
	display: none;
	}

.navbar-brand{
	margin-top:10px;
	width: 200px;
	height: 45px;
	background-image: url(../images/logo_sm.png);
	background-repeat: no-repeat;
	display: block;
	text-indent: -9999px;
	float: left;
	}



/* --　★★PC グローバルナビText カラー  --*/
.navbar-inverse .navbar-nav > li > a {

}
/* --　★★PC グローバルナビText ホバー、フォーカス時 --*/
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
	color: #0079B4!important;
	background-color: transparent;
}


footer.liYoko{
	width: 100%;
	float: left;
	}

footer .liYoko ul{
	margin-bottom: 25px;
	padding-left: 0px;
	width: 100%;
	float: left;
	display: block;
	}

footer .liYoko li{
	border: 0px;
	width: 14.2857%;
	background-color: transparent;
	background-image: -webkit-linear-gradient(270deg,rgba(61,61,61,0.48) 0%,rgba(122,122,122,0.48) 100%);
	background-image: linear-gradient(180deg,rgba(61,61,61,0.48) 0%,rgba(122,122,122,0.48) 100%);
}

footer .liYoko li a{
	
	}

footer .home p{
	display: none;
}

/* ===================================================================== */
/*	タブレット プライマリーナビゲーション
/* ===================================================================== */


/* ===================================================================== */
/*	タブレット グローバルナビゲーション
/* ===================================================================== */
.container.headerArea{
	display: block;
	float: none;
	width:100%;
	}
.navbar-inverse .navbar-collapse,
.navbar-inverse .navbar-form {
	padding-bottom:10px;
	border-color: #101010;
}


li.globalnavi{
	font-size:80%;}


/* ===================================================================== */
/*	タブレット ローカルナビゲーション
/* ===================================================================== */


/* ===================================================================== */
/*	タブレット フッター
/* ===================================================================== */

.primaryArea{
	display: block;
	float: right;
	width:auto;
}

.primaryArea i{
	color: rgba(0,108,255,1.00);	
	}
	
.primaryArea ul{
	margin-top:10px;}
.primaryArea li{
	float: left;
	width: 85px;
	list-style-type: none;
	font-size: 90%;
}

	.primaryArea li.list01 i{
	font-size: 120%;		
	}
	
.primaryArea li.list01 .glyphicon{
	font-size: 120%;
}
.primaryArea li.list02 .glyphicon{
	
	font-size: 120%;}

.primaryArea li.list03 .glyphicon{
	width: 80px;}

.primaryArea li.list02{
	width: 105px;}

.primaryArea li.list03{
	width: auto;}

/* --　★★タブレット　ロゴマーク  --*/
.navbar-brand{
	width: 177px;
	height: 45px;
	margin-top:5px;
	background-image: url(../images/logo_sm.png);
	margin-left:0px!important;
	}



/* --　★★PC グローバルナビText カラー  --*/
.navbar-inverse .navbar-nav > li > a {
color: #fff;
}
/* --　★★PC グローバルナビText ホバー、フォーカス時 --*/
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
	color: #B5DFFF!important;
	background-color: transparent;
}


/* ===================================================================== */
/*	タブレット大 グローバルナビゲーション
/* ===================================================================== */
li.globalnavi{
	font-size:70%;}
	
.navbar-nav{width:100%;}
.navbar-nav li.list01, .navbar-nav li.list02, .navbar-nav li.list03, .navbar-nav li.list04, .navbar-nav li.list05, .navbar-nav li.list06, .navbar-nav li.list07, .navbar-nav li.list08{
	width: 12.49%;
	text-align: center;
	background-image: -webkit-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: -moz-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: -o-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: linear-gradient(180deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
}

.navbar-nav li.list01 a, .navbar-nav li.list02 a, .navbar-nav li.list03 a, .navbar-nav li.list04 a, .navbar-nav li.list05 a, .navbar-nav li.list06 a, .navbar-nav li.list07 a, .navbar-nav li.list08 a{
	padding-left:0px;
	padding-right:0px;
	}

.navbar-nav li.list01 li, .navbar-nav li.list02 li, .navbar-nav li.list03 li, .navbar-nav li.list04 li, .navbar-nav li.list05 li, .navbar-nav li.list06 li, .navbar-nav li.list07 li, .navbar-nav li.list08 li{
	padding-left:10px;
	padding-right:10px;
	}

.phone{
	text-align: right;
	padding-right: 0px;
	clear: both;
	font-size: 140%;
	}

	
.subNav{display: none}	
}

@media (min-width: 992px) {
/* ##################################################################### */
/*	タブレット大
/* ##################################################################### */
/* ===================================================================== */
/*	タブレット大 基本設定
/* ===================================================================== */
body{padding-top: 120px}
/* ===================================================================== */
/*	タブレット大 プライマリーナビゲーション
/* ===================================================================== */
.container.headerArea{
	display: block;
	float: none;
	width:992px;
	}

/* --　★★タブレット　ロゴマーク  --*/
{
	width: 177px;
	height: 45px;
	margin-top:5px;
	background-image: url(../images/logo_sm.png);
	margin-left:0px!important;
	}



/* --　★★PC グローバルナビText カラー  --*/
.navbar-inverse .navbar-nav > li > a {
color: #fff;
}
/* --　★★PC グローバルナビText ホバー、フォーカス時 --*/
.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
	color: #B5DFFF!important;
	background-color: transparent;
}


/* ===================================================================== */
/*	タブレット大 グローバルナビゲーション
/* ===================================================================== */
li.globalnavi{
	font-size:80%;}
	
.navbar-nav{width:100%;}
.navbar-nav li.list01, .navbar-nav li.list02, .navbar-nav li.list03, .navbar-nav li.list04, .navbar-nav li.list05, .navbar-nav li.list06, .navbar-nav li.list07, .navbar-nav li.list08 .navbar-nav li.list09 .navbar-nav li.list10 .navbar-nav li.list11 .navbar-nav li.list12{
	width: 12.49%;
	text-align: center;
	background-image: -webkit-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: -moz-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: -o-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: linear-gradient(180deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
}


}

@media (min-width: 1200px) {
/* ##################################################################### */
/*	PC　コンピュータ
/* ##################################################################### */
/* ===================================================================== */
/*	PC　コンピュータ 基本設定
/* ===================================================================== */
body{padding-top: 140px}

/* ===================================================================== */
/*	PC プライマリーナビゲーション
/* ===================================================================== */
.container.headerArea{
	display: block;
	float: none;
	width:1140px;
	}

.navbar-brand{
	width:275px;
	height:65px;
	margin-top:5px;
	margin-bottom:5px;
	background-image: url(../images/logo_pc.png);
	margin-left:-10px!important;
	padding-left:0px!important;
	background-position: 0px 0px;
	}


/* --　★★PC　グローバルナビの角丸 */
li.list01.globalnavi,li.list01.globalnavi a{
	border-top-left-radius: 12px;
	border-bottom-left-radius: 12px;
	}
li.list08.globalnavi,li.list08.globalnavi a{
	border-top-right-radius: 12px;
	border-bottom-right-radius: 12px;
	}

/* --　★★PC　グローバルナビ クリック時の のBGカラー */
.navbar-inverse .navbar-nav > li > a:focus {
	color: #fff;
	background-color: #0000FF!important;
}


/* ===================================================================== */
/*	PC　コンピュータ グローバルナビゲーション
/* ===================================================================== */
li.globalnavi{
	font-size:85%;}
.navbar-nav{width:100%;}
.navbar-nav li.list01, .navbar-nav li.list02, .navbar-nav li.list03, .navbar-nav li.list04, .navbar-nav li.list05, .navbar-nav li.list06, .navbar-nav li.list07, .navbar-nav li.list08 .navbar-nav li.list09 .navbar-nav li.list10 .navbar-nav li.list11 .navbar-nav li.list12{
	width: 12.49%;
	text-align: center;
	background-image: -webkit-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: -moz-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: -o-linear-gradient(270deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-image: linear-gradient(180deg,rgba(29,82,205,1.00) 0%,rgba(58,124,239,0.93) 88.60%);
	background-color: #3475F8;
}


/* --　★★PC　グローバルナビのBGカラー アンダーラインカラー */
.navbar-inverse {
	margin-bottom:30px;
}
/* --　★★PC　グローバルナビドロップダウン時の最低幅 */
.dropdown-menu {
  min-width: 250px;
}


/* ===================================================================== */
/*	PC　コンピュータ フッター
/* ===================================================================== */
.breadCrumb li a{
	text-decoration: none!important;
	list-style-type: none!important;
	}

footer{
	background-color: #303030;
	padding-top: 25px;
	padding-bottom: 15px;
	background-image: url(../images/bg_footer.png), -webkit-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.73) 100%);
	background-image: url(../images/bg_footer.png), -moz-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.73) 100%);
	background-image: url(../images/bg_footer.png), -o-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.73) 100%);
	background-image: url(../images/bg_footer.png), linear-gradient(180deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.73) 100%);
	color: #E5E5E5;
	background-repeat: no-repeat;
	background-position: center top;
	}
#localNav .bannerArea ul li{
	background-color: transparent;
	background-image: none;
	border-style: none;
	width:100%;
	}
}