﻿


/*------------------------------------------------------------------

	Reset and Base

------------------------------------------------------------------*/

html { overflow-y:scroll; }
body { font-family:Meiryo, 'MS PGothic', arial, sans-serif; }
h1 { margin:0; padding:0; }
p { margin:0; padding:0; line-height:1.6; }
ul { list-style-type:none; margin:0; padding:0; line-height:1.6; }
li { margin:0; padding:0; line-height:1.6; }
dl, dt, dd { margin:0; padding:0; line-height:1.6; }
img { border:0; vertical-align:bottom; }
table { border-collapse:collapse; border-spacing:0; width:100%; }
th { white-space:nowrap; }
th, td { word-break:break-all; margin:0; padding:0; line-height:1.6; }
a { text-decoration:none; outline:none !important; color:#333; }
a:hover { text-decoration:underline; color:#333; }
article,aside,figure,header,footer,nav,section { display:block; }
textarea { resize:vertical; }
button{ background-color:transparent; border:none; cursor:pointer; outline:none; padding:0; appearance:none; }
input, select, textarea, button { font-family:Meiryo, 'MS PGothic', arial, sans-serif; }
input[type = 'text'], input[type = 'email'], input[type = 'tel'], input[type = 'password'], textarea, select {
	width:100%; border:1px #ccc solid; border-radius:5px; padding:10px;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
pre {
	font-family:Meiryo, 'MS PGothic', arial, sans-serif; border:0; font-size:1.4rem; line-height:1.6; background:#fff;
	white-space:-moz-pre-wrap;
	white-space:-pre-wrap;
	white-space:-o-pre-wrap;
	white-space:pre-wrap;
	word-wrap:break-word;
}
* {
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-o-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
}

.cf:before { content:''; display:table; }
.cf:after { content:''; display:table; clear:both; }
.cf { zoom:1; } /* For IE7 (trigger hasLayout) */






/*------------------------------------------------------------------

	Bootstrap 設定リセット

------------------------------------------------------------------*/

.row { margin:0; padding:0; }

/* IEでfixedボタンとスクロールバーが重なるのを回避 */
@-ms-viewport { width:auto; }






/*------------------------------------------------------------------

	Common

------------------------------------------------------------------*/

html { position:relative; min-height:100%; font-size:62.5%; }
body { font-family:Meiryo, 'MS PGothic', arial, sans-serif; width:100%; height:100%; margin:0; padding:0; font-size:1.4rem; color:#444; }
h2 { position:relative; margin-bottom:15px !important; padding:15px 0; font-size:1.8rem; font-weight:normal; border-bottom:1px #ddd dashed; }
h2 i { margin-right:6px; font-size:1.8rem; }
h2 a { position:absolute; right:0; bottom:6px; font-size:1.2rem; color:#999; }
i { font-family:FontAwesome; }
.link_color { color:#007ebe; }
.indent { padding-left:1em; text-indent:-1em; }

/*大枠*/
.site { display:flex; flex-direction:column; min-height:100vh; }

/* ボタン */
.btn_wrap { margin:10px auto; text-align:center; }
.btn_wrap a:hover { text-decoration:none; }
.btn_wrap .blue { width:70%; background:#1fa3a5; margin:10px 0; padding:15px; border-radius:80px; color:#fff; box-shadow:0 2px 2px #bbb; font-size:1.6rem; }
.btn_wrap .gray { width:70%; background:#999; margin:10px 0; padding:15px; border-radius:80px; color:#fff; box-shadow:0 2px 2px #bbb; font-size:1.6rem; }
.btn_wrap .item_search { width:100%; background:#eee; padding:10px; border:1px #ddd solid; border-radius:5px; }
.btn_wrap .btn:hover { opacity:0.8; }
.btn_side .btn { display:inline-block; width:49%; }
.btn_side .btn:first-of-type { margin:0 10px 0 0; }

/* エラー */
.error_txt { padding:10px 0; font-weight:bold; color:#d10000; }

/* パンくず */
.breadcrumb { overflow:hidden; width:100%; height:30px; margin:0px auto; padding:0; border-radius:0; border-bottom:1px solid #ddd; background:#f0f0f0; }
.breadcrumb .inner { max-width:1160px; margin:0px auto; padding:0px 5px; }
.breadcrumb .inner .content { padding:0px 5px; }
.breadcrumb ul { display:table; padding:0; }
.breadcrumb li { display:table-cell; white-space:nowrap; border-left:1px solid #ddd; }
.breadcrumb a { position:relative; display:inline-block; *display:inline; *zoom:1; text-decoration:none; padding:6px 20px 5px 20px; font-size:1.1rem; }
.breadcrumb a:hover { background:#ddd; }
.breadcrumb .current a:hover { cursor:auto; background:#eee; }

@media (max-width:1170px) {

	.breadcrumb .inner { max-width:940px; }

}

@media (max-width:970px) {

	.breadcrumb .inner { max-width:720px; }
}






/*------------------------------------------------------------------

	Header

------------------------------------------------------------------*/

.masthead { margin:-20px 0 0 0; }
.masthead .container { position:relative; padding:50px 0 15px 0; }
.masthead .search { position:absolute; bottom:15px; right:0; }
.masthead .search .btn { background:#333; border:1px #333 solid; }
.masthead .search .btn i { color:#fff !important; }
.masthead .search .input-group { bottom:0; }
.input-group .form-control, .input-group-addon, .input-group-btn { height:40px !important; }
.input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group { height:40px !important; }
.masthead img { height:80px; }
.masthead .head_label { position:fixed; z-index:9999; width:100%; background:#eee;/*e0e0e0*/ padding:10px; }
.masthead .head_label .inner { max-width:1160px; margin:0 auto; }
.masthead .user_name { font-size:1.2rem; line-height:1.9; }
.masthead .user_link { text-align:right; }
.masthead .user_link li { display:inline-block; padding:0 10px; border-right:1px #333 dotted; font-size:1.2rem; }
.masthead .user_link li:last-child { border-right:0; }
.masthead .user_link a { color:#333; }
.masthead .cart a, .masthead .cart i { color:#0f5db8; }
.masthead .fa-shopping-cart { color:#333; padding:0 5px 0 0; }

@media (max-width:767px) {

	.masthead { text-align:center; }
	.masthead .container { padding:20px 0 10px 0; }
	.masthead .search { position:static; padding:10px 15px; }
	.masthead img { width:150px; }
	.masthead .head_label { position:static; background:#eee;/*e0e0e0*/ padding:10px; }
	.user_name { text-align:center; padding:0 0 5px 0; }
	.user_link ul {text-align:center; }


}

/* ナビ */
.navi { text-align:center; background:#333; }
.navi li { display:inline-block; }
.navi a { display:block; color:#fff; padding:10px 50px; }
.navi a:hover { background:#999; text-decoration:none; }

@media (max-width:767px) {

	.navi li { display:block; float:left; width:50%; border:1px #fff solid; }
	.navi a { display:block;  background:#333; color:#fff; padding:15px 0; }
	.navi a:hover { background:#999; text-decoration:none; }


}

/* ドロワー */
#btn_open { overflow:hidden; background:#333; width:40px; height:40px; border-radius:5px; position:absolute; top:80px; left:10px; z-index:2; }
#btn_open .fa-bars { padding:10px; color:#fff; }
#drawer_open { position:absolute; z-index:1; top:3px; left:2px; cursor:pointer; }
#btn_close { overflow:hidden; position:absolute; top:0; right:0; z-index:3; background:#eee; padding:10px; border-radius:5px; }
#drawer_close { cursor:pointer; position:relative; right:0; }
#drawer_close .fa-times { padding:10px; }
#drawer_wrap { display:none; }

@media (max-width:767px) {

	#drawer_menu { width:70%; position:absolute; top:0; bottom:0; left:-9999px; z-index:5; background:#eee; padding:20px 10px; }
	.drawer_menu_inner { height:100%; overflow:auto; }

}

@media (min-width:767px) {

	#btn_open ,#btn_close { display:none; }
	#drawer_menu { position:static; /*float:left; width:150px;*/ background:none; }
	.screen_normal { position:static !important; }

}






/*------------------------------------------------------------------

	Left

------------------------------------------------------------------*/

.contents_bnr img { width:100%; }






/*------------------------------------------------------------------

	Footer

------------------------------------------------------------------*/

footer { width:100%; margin:auto 0 0 0; padding:15px 0; background:#f0f0f0; }
footer i:hover { cursor:default; }

/* その他リンク */
.other_link { padding:15px 0; text-align:center; }
.other_link li { display:inline-block; padding:0 20px; }
.other_link li:last-child { border-right:0; }
.other_link a { color:#777; }

@media screen and (max-width:768px) {

	.other_link { padding:10px 0; }
	.other_link li { display:block; }
	.other_link a { display:block; padding:10px; }

}

/* コピーライト */
footer .copy { padding:15px 10px; border-top:1px #e5e5e5 solid; text-align:center; color:#777; font-size:1.2rem; }


/* ページ上部へ */
.pagetop { text-align:center; margin:50px 0; }
.pagetop a { display:block; padding:10px; position:relative; text-decoration:none; }
.pagetop .fa-chevron-up { padding:0 0 0 5px; color:#333; position:relative; bottom:1px; }






/*------------------------------------------------------------------END*/