
/*=======================================================

	Penguin CSS 1.0
	ATHR : 9KNOT.
	DATE : 2017/5
	FILE : style.css
    ----------------------------
	Logo COLOR	: #FFF	(logo)
	BASE COLOR	: #000	(menu)
	LINK COLOR  : #FF3F00	(orange)
	LINK COLOR2	: #DF3800	(orange mat)

=========================================================


/*-------------------------------------
	reset
-------------------------------------*/

body,
h1, h2, h3, h4, h5, h6,
p, address, blockquote, pre, div,
dl, dt, dd, ol, ul, li,
th, td,
form, fieldset, input, textarea { margin: 0; padding: 0; outline: none;}

input{ vertical-align : middle ;}

select { margin: 0; }



/*-------------------------------------
	アピアランス
-------------------------------------*/

abbr, acronym { border:0 none; }
q::before, q::after { content:""; }
img { border:0 none; vertical-align:bottom; }
object { outline:none; }
table { border-spacing:0; border-collapse: collapse; border-spacing: 0; word-break: break-all; word-wrap: break-word; }
*:first-child+html table { border-collapse:collapse; }	/* IE 7 */
* html table { border-collapse:collapse; }				/* IE 6 */
caption { text-align:left; }
th,
td { text-align:left; vertical-align:middle; empty-cells:show; }
hr { display:none; }
fieldset { border:0 none; }
label { cursor: pointer; }

/* 全対応 */

*, *::before, *::after {
	font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;
	 -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
	}

*::selection { background: #222;}
*::-moz-selection { background: #222;}

.box-w *::selection { background: #EFEFEF;}
.box-w *::-moz-selection { background: #EFEFEF;}

/*-------------------------------------
	文字装飾 / font
-------------------------------------*/

h1, h2, h3, h4, h5, h6 {
	position: relative; margin-bottom: 60px; font-style:normal; font-weight: 500; line-height: 140%; color: #FFF; text-align: center; }

h1 { font-size:44px; line-height: 120%;}
h2 { font-size:40px; font-weight: 200; line-height: 120%; letter-spacing: 0.15em;}
h3 { font-size:30px;}
h4 { font-size:28px;}
h5 { font-size:18px;}
h6 { font-size:18px;}

article h2 span,
article h3 span,
article h4 span,
.h-eng span { color: #FF3F00;}

p, address, blockquote, pre, div,
abbr, acronym, dfn, cite, q, code, kbd, samp, var,
dl, ol, ul,
caption, th { font-weight:normal; font-style:normal; }
em, strong, optgroup { font-weight:bold; font-style:normal; }

/* font-family */

	.list li .category em,
	#Information .cols .contact a b
{ font-family: "游ゴシック", "Yu Gothic", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "ＭＳ ゴシック", sans-serif;}


	body h2,
	body h2 span,
	.h-eng,
	.h-eng span,
	#Visual h1,
	#Visual em,
	.banners p,
	.banners p span,
	#Home #Visual p,
	.products .brand-list a
{ font-family: "游明朝体", "Yu Mincho", YuMincho, Times, sans-serif;}


	.copyright
{ font-family:Arial, Verdana, Geneva, Helvetica, sans-serif;}

	.subnavi .sub b,
	.subnavi li i,
	.list.new li::before,
	.list li .category i,
	#Information .cols .contact,
	#PageTop a,
	footer h3
{ font-family: Futura,STHeitiK-Medium,"Avenir-Medium","Avenir",Century Gothic,Arial,Helvetica,sans-serif;}


/*-------------------------------------
	HTML5
-------------------------------------*/

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { position:relative; display:block; margin:0 0 0 0; padding:0 0 0 0; }


/*-------------------------------------
	要素
-------------------------------------*/

html { width: 100%; width: 100%; height:100%; text-align: center;}

body {
	position: relative;
	display: block;
	margin: 0;
	width: 100%;
	height: 100%;
	color:  #FFF;
	font-size: 18px;
	font-weight: 500;
	text-align: center;
	line-height: 1;
	-webkit-text-size-adjust: 100%;
	background: #000;
/*	border-top: 2px solid #C45417;*/
	}


/* links */
a, input, object{ outline:none; }

a {
	margin: 0;
	padding: 0;
	border: 0;
	color: #FFF;
	text-decoration: none;
	vertical-align: baseline;
	background: transparent;
	-webkit-tap-highlight-color:rgba(0,0,0,0.2);
	}
a:visited {	color: #999; text-decoration:none;}
a:active { color: #E03819; text-decoration:none; }
a:hover { color: #E03819; text-decoration:none; opacity: 1;}

a:hover img { opacity: 0.8; }
a:hover img.rollover { opacity: 1;}


a img {  -webkit-tap-highlight-color: transparent;}

/* table */
table { width: 100%; color: #333; border-collapse: separate; border-spacing: 0; border-bottom: 1px solid #333;}
th, td { padding: 10px 2px; font-size: 14px; font-weight: normal; text-align: left; line-height: 140%; vertical-align: top; border-top: 1px solid #333;}
td p,
td ul { margin-bottom: 0 !important;}

table.arbitrary { width: auto; min-width: 65%;}


/* form関係 */

form { margin-top: 40px;}
input, select, optgroup, textarea, label, kbd { vertical-align: middle;}

label { font-size: 16px;}
#Contact th span,
fieldset legend span { position: absolute; right: 10px; display: inline-block; margin: 0; padding: 4px 6px; color: #FFF; font-size: 11px; line-height: 1; vertical-align: middle; background: #999; border-radius: 2px;}
fieldset legend span { right: -50px; top: 0; font-weight: normal;}
form p.note { margin: 5px 0; font-size: 14px; color: #F33;}

input[type="hidden"]{ display: none;}
input[type="text"],
input[type="password"],
input[type="tel"],
input[type="email"],
input[type="url"],
select,
textarea {
	margin: 0;
	padding: 4px 7px;
	width: 100%;
	font-size: 16px;
	background: #EFEFEF;
	border: 1px solid #DDD;
	border-radius: 2px;
	box-sizing: border-box;
	}

textarea { height: 240px;}
select option { margin: 0; padding: 2px 5px;}

fieldset { margin: 40px 0;}
fieldset legend { position: relative; margin-bottom: 20px; font-weight: bold;}
fieldset label { display: inline-block; min-width: 340px;}
fieldset input { margin-right: 10px;}

input:focus { border: 1px dotted #CCC; background: #FFF;}

form th { position: relative;}
form th small { font-size: 12px; }
form th span { position: absolute; top: 20px;  right: 10px; display: inline-block; padding: 0 5px; height: 16px; color: #FFF; font-size: 10px; line-height: 16px; vertical-align: middle; background: #999; border-radius: 3px;}

/* button ボタン デフォルト */

.submit { margin-top: 50px; text-align: center;}
.submit button,

a.btn,
input[type=submit],
form:not(#Search) button {
	display: inline-block;
	margin-top: 20px;
	padding: 8px 30px;
	min-width: 180px;
	color: #FFF !important;
	font-size: 18px;
	font-weight: normal;
	text-align: center;
	background: #333;
	border-radius: 30px;
	cursor: pointer;
	}
a.btn:visited { color: #FFF;}
input[type=submit] { min-width: 250px;}


button:hover,
a.btn:hover {
	color: #FFF;
	background: #DF3800;
	}

button img { vertical-align: middle;}

form#Search button { display: inline-block; background: none; border: none;}
form#Search button img { width: 26px; height: auto;}


.link { margin-top: 20px; padding-left: 15px; background: url(/images/common/arrow-orange.png) left 8px no-repeat; background-size: 6px auto;}
.link:hover { background: url(/images/common/arrow-lightgray.png) left 8px no-repeat; background-size: 6px auto;}

/* list dl リスト・定義 */
ul { list-style: none; }
article ol { margin: 0 0 20px 26px;}
td ul.disc,
td ol { margin-left: 20px;}

li { position: relative; text-align: left; line-height: 140%; }

dl { margin: 0 auto; padding: 0;  width: 100%; text-align: left;  }
dt,dd { display: block; padding: 0 0 15px 0; font-weight: normal; text-align: left; line-height: 130%; vertical-align: top; }
dt { clear: both; float: left; display:inline; width: 10%; text-align: right; }
dd { float: left; width: 90%; white-space: normal; }

/* 文字装飾 */
em { color: #F33;}
small { font-size: 13px;}
i { font-style: normal; font-weight:  normal;}
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold;}
u { text-decoration: none;}


/* 罫線 */
hr {
	clear: both;
	position: relative;
	display: block;
	margin: 100px auto;
	width: 100%;
	height: 1px;
	text-align: center;
	border: none;
	border-top: 1px solid #666;
	border-spacing: 0;
	text-shadow: none;
	}


/*-----------------------------------------
	共通 
-----------------------------------------*/

/* 中央寄せ */
article hr,
article .box,
article .col2,
article .table-set,
footer nav {
	margin-left: auto;
	margin-right: auto;
	width: 88%;
	max-width: 1360px;
	text-align: center;
	}

.clear::after,
.wp-article h1::before,
.wp-article h2::before,
.wp-article h3::before,
.wp-article h4::before,
.wp-article h5::before,
.wp-article h6::before,
.fix::after,
.box::after,
article::after,
article section::after,
.list::after,
.list-image::after { clear:both; visibility:hidden; content:'.'; display:block; height:0; }

article { position: relative; }
article section { padding: 0 0 200px;}
article section:nth-of-type(1) { padding-top: 0;}
article p.box { margin-bottom: 60px; padding: 0; text-align: left;}



.clear { clear: both;}

/* box */
.box-w { padding: 100px 50px  200px !important; color: #333; background: #FFF;}
.box-w .box { text-align: left;}
.box-w a { color: #DF3800;}
.box-w a:hover { color: #39C;}
.box-w h2 { font-size: 54px;}
.box-w h2, .box-w h3, .box-w h4, .box-w h5, .box-w h6 { color: #333;}
.box-w h3, .box-w h4, .box-w h5, .box-w h6 { margin-bottom: 20px; font-weight: bold; text-align: left;}
.box-w hr { width: 100%; border-color: #CCC;}
.single .box-w hr { margin: 60px 0 0 0;}
.box-w .col2 { width: 100%;}

.box-border { margin: 60px 0; padding: 40px; border: 3px solid #F2F2F2;}
div.box-border h3, div.box-border h4, div.box-border h5, div.box-border h6 { margin: 0 0 20px 0;}
.box-border p:last-child { margin-bottom: 0;}

div.note { margin: 60px 0 0; padding: 30px 40px; background: #F8F8F8; border: 1px solid #CCC;}
div.note h3, div.note h4, div.note h5 div.note h6 { margin: 0 0 20px 0; padding: 0; background: none;}
div.note li { margin: 0 0 10px;}


/* p */

article p { margin-bottom: 20px; line-height: 160%;}

.right { text-align: right;}
.left { text-align: left;}
.center { margin-left: auto; margin-right: auto; text-align: center !important;}


/* 2カラム .col2 */
.col2 { display: table;}
.col2 .left,
.col2 .right { display: table-cell; text-align: left; vertical-align: top; }

/* 複数カラム .table-set */
.table-set { display: table;}
.table-set .cols { display: table-cell; vertical-align: middle;}

/* error */
.error { color: #F00;}
.error::selection { background: #FCC;}
.error::-moz-selection { background: #FCC}

ul.error { margin: 20px auto; padding: 0 0 10px; max-width: 590px; list-style: disc;}

/* アスタリスク※のリスト */
.asterisk { position: relative;}
small.asterisk::before,
.asterisk > li::before,
p.asterisk:before {
	content: "※";
	display: inline-block;
	margin: 0 3px 0 -18px;
	}

.asterisk li,
p.asterisk,
small.asterisk {
	margin: 0;
	padding-left: 18px;
	font-weight: normal;
	line-height: 140%;
	}

.asterisk ul { list-style: disc;}
.asterisk ul ul { list-style: none;}

small.asterisk { margin: 0 0 7px; font-size: 12px;}

.asterisk li:last-child { margin-bottom: 0 !important;}

ul.disc { margin: 0 0 20px 32px; list-style: disc;}



/* WP */
.wp-article .category{color:#888;}
.wp-article .date{margin:0 0 30px; color: #888;text-align:right;}
.wp-article h1,
.wp-article h2{ clear:both; margin:0 0 60px;padding:0;font-size:36px;font-weight:normal;line-height:120%;}
.wp-article h3,
.wp-article h4{ clear:both; display:block;margin:0 0 40px; font-size:22px;}
.wp-article h3 { margin-top: 60px;}
.wp-article h4 { display: inline-block; padding: 6px 10px; font-size: 16px; background: #F2F2F2; border-radius: 3px;}
.wp-article ul:not(.asterisk):not(.list-photo):not(.list-image):not(.gallery):not(.icons){ margin:0 0 20px 24px;list-style:disc;}
.wp-article ol:not(.asterisk){ margin:0 0 20px 24px;list-style:decimal;}
.wp-article li small { margin: 0 0 10px;}
.wp-article li table{ margin-top: 10px;}

.wp-article table{border-collapse:collapse; margin-bottom: 40px; width: auto;}
.wp-article table th,
.wp-article table td{padding:6px 10px;font-size:14px; vertical-align: middle;border:1px solid #CCC;}
.wp-article table th{ min-width: 80px;text-align:center;font-weight:bold; background: #F2F2F2;}
.wp-article table p{font-size:14px;}
.wp-article table hr{margin:8px 0;}

.wp-article li tbody th,
.wp-article li tbody td{text-align:left;}
.wp-article .tags{font-size:13px;}
.wp-article .tags a{display:inline-block;margin:0 5px 5px 0;padding:5px 8px;color:#666;font-size:12px;line-height:1;background:#F2F2F2;border-radius:3px;}
.wp-article .tags a:hover{background:#EEE;border:none;}
.wp-article img { width: auto; max-width:100% !important; height:auto; vertical-align: top;}
.wp-article .aligncenter{display:block;margin:0 auto 40px; text-align: center;}
.wp-article .alignleft{float:left;margin:0 40px 40px 0;}
.wp-article .alignright{float:right;margin:0 0 40px 40px;}
.wp-article .link{clear:both;}
.wp-article strong{color:#E03819;}
.wp-article blockquote{position:relative;display:inline-block;margin:-15px 0 15px 19px;padding:15px 50px 12px;background:#F2F2F2;border-radius:3px;}
.wp-article blockquote p{font-size:15px;line-height:150%;}
.wp-article blockquote::before{content:"";position:absolute;left:15px;top:12px;display:inline-block;width:20px;height:20px;background:url(/images/common/icon-quote-L.png) left top no-repeat;background-size:20px auto;opacity:0.3;}
.wp-article blockquote::after{content:"";position:absolute;right:15px;top:12px;display:inline-block;width:20px;height:20px;background:url(/images/common/icon-quote-R.png) left top no-repeat;background-size:20px auto;opacity:0.3;}
.wp-article small,
.wp-article p small{display:inline-block;margin-top:15px;color:#999;font-size:14px;line-height:140%;}
.wp-article p small.noblock{display:inline;}

.wp-article .btn-back { position: absolute; right: 40px; margin-bottom: 40px; z-index: 768;}
.wp-article .btn-back p { margin-bottom: 10px;}
.wp-article .back-bak a,
.wp-article .back-brd a,
.wp-article .back-pro a { display: inline-block; width: 80px; height: 80px; color: #FFF; font-size: 13px; text-align: center; background: #333; border-radius: 50%; z-index: 50;}
.wp-article .back-bak a:hover,
.wp-article .back-brd a:hover,
.wp-article .back-pro a:hover { background: #DF3800;}
.wp-article .back-brd a img,
.wp-article .back-pro a img { margin-top: 20px; width: 30px; height: auto;}
.wp-article .back-bak a img { margin: 20px 5px 0 0; width: auto; height: 28px;}

.products #Visual em { padding-top: 70px;}
.products #Visual h1 { position: absolute; left: 0; right: 0; top: 0; display: inline-block; padding-top: 198px; font-size: 20px; font-weight: bold; letter-spacing: normal; background: none; text-shadow: 0 2px 5px rgba(0,0,0,0.8);}
.products h3.h-eng { font-size: 40px; font-weight: normal; }

.products .brands { margin-top: 100px;}

.products .brand-list { display: table; margin: 120px auto 80px; border-left: 1px solid #333;}
.products .brand-list li { display: table-cell; padding: 0; border-right: 1px solid #333;}
.products .brand-list li a { display: block; padding: 16px 20px; min-width: 200px; font-size: 22px; text-align: center;}
.products .brand-list li.current a { color: #FF3F00;}

.products ul.submenu { display: table; margin-bottom: 80px; width: 100%; border-left: 1px solid #333;}
.products ul.submenu li { display: table-cell; width: 25%; font-size: 22px; text-align: center; vertical-align: middle; border-right: 1px solid #333;}
.products ul.submenu li a { position: relative; display: inline-block; padding: 0 0 5px 65px; color: #FFF; text-align: left; vertical-align: middle; word-wrap: break-word; }
.products ul.submenu li a img { position: absolute; left: 0; top: 12px; width: 50px; height: auto; vertical-align: middle;}
.products ul.submenu li:nth-of-type(4) a { letter-spacing: -0.15em; }
.products ul.submenu li span { margin-bottom: 5px; font-size: 16px; letter-spacing: normal; line-height: 1;}
.products ul.submenu li a:hover { color: #999;}

.single article h3 { margin-top: 60px; padding-top: 60px; border-top: 1px solid #CCC;}
.single article p { display: inherit; margin-bottom: 40px; line-height: 180%;}
.single .wp-article ul li,
.single article ol li{ margin:8px 0;}

.single td ul li,
.single td ol li{margin:3px 0;}
.single ul.asterisk.small{margin:0;}
.single ul.asterisk.small li{margin:3px 0;}
.single ul.asterisk + h4{margin-top:25px;}
.single dl{float:none;margin:12px 0 30px;width:auto;}
.single dl dt{font-size:15px;text-align:center;}
.single dl dd{font-size:15px;}
.single dl dd span{padding-left:5px;color:#999;font-size:12px;}
.single .box-w iframe { display: inline-block; margin: 0 40px 0 0;}
.single .wp-article ul.icons { display: table; margin: 40px auto 60px; width: auto; text-align: center; }
.single .wp-article .icons li { display: table-cell; padding: 0 15px; color: #888; font-size: 14px; text-align: center; }
.single .wp-article .icons li img { margin-bottom: 5px; width: 100px; height: auto;}


.wp-pagenavi a,
.wp-pagenavi span { display: inline-block; margin: 0 3px ; padding: 5px; min-width: 30px; color: #888; font-size: 13px; background: #222; border: none; border-radius: 3px;}
.wp-pagenavi a:hover { color: #E03819;}
.wp-pagenavi span.current { color: #E03819 ; font-weight: bold; }
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink,
.wp-pagenavi .last,
.wp-pagenavi .first,
.wp-pagenavi .pages { margin: 0 5px; border: none;}
.wp-pagenavi .pages { margin-right: 15px;}


/* 一覧 .list */

.list { margin: 0 auto ; width: 100%; text-align: center;}
.list ul { display: block; margin: 0 auto; width: auto; max-width: 1300px; text-align: left;}
.list li { float:left; position: relative; display: block; margin: 0 0 60px; padding: 0 30px; width: 25%; font-size: 14px; vertical-align: top;}
.list li a { display: block; width: 100%; max-width: 250px;}
.list li h3 { margin: 0 0 5px; padding: 0; font-size: 18px; color: #DF3800; font-weight: bold; text-align: left;}
.list li figure { overflow: hidden; width: 100%; max-width: 250px; margin-bottom: 20px; text-align: center;}
.list li figure img { width: auto; height: 180px;}
.list li .category { margin: 0 0 18px; padding: 0;}
.list li .category i { display: inline-block; margin-right: 10px; color: #FFF; font-size: 40px; vertical-align: middle;}
.list li .category em { display: inline-block; padding: 5px 10px; color: #FFF; font-size: 12px; font-weight: 600; line-height: 1; vertical-align: middle; background: #DF3800; }
.list li a p { color: #FFF;}

.box-w .list, .box-w .list ul, .box-w .list ul li, .box-w .list ul li a { margin: 0 !important;}
.box-w .list a { margin-bottom: 0; color: #333; font-size: 18px;}
.box-w .list img { margin-bottom: 10px;}


#NewArrivals,
#Pickup,
#Categories { margin: 0 auto; width: 90%;}
.list.new li::before { content:"NEW"; position: absolute; top: 20px; left: 30px; display: inline-block; padding: 1px 5px; color: #FFF; font-size: 13px; font-weight: bold; background: #DF3800; z-index: 60;}


/* カテゴリリンク */
.btn-box { margin: 0 auto; width: 100%; text-align: center;}
.btn-box ul { display: block; margin: 0 auto; width: auto; max-width: 1080px; text-align: left;}
.btn-box li { display: inline-block; padding: 20px; vertical-align: top;}
.btn-box li a { display: table-cell; width: 220px; height: 60px; line-height: 120%; text-align: center; vertical-align: middle; border: 1px solid #333;}
.btn-box li a:hover { color: #FFF;  background: #D03400; border: none; }

.box-w ul.btn-box { display: table; margin: 60px 0; padding: 0; width: 100%; text-align: center; border-right: 1px solid #CCC;}
.box-w .btn-box li { display: table-cell; margin: 0 auto; padding: 0; width: auto; text-align: center; vertical-align: middle; border-left: 1px solid #CCC;  border-radius: 2px;}
.box-w .btn-box li a { display: initial; margin: 0 auto; padding: 0; width: auto; color: #666; text-align: center; background: #FFF; border: none;}
.box-w .btn-box li a:hover { color: #DF3800; }

/* 特長 */
#Point { margin-bottom: 60px;}
#Point li { display: inline-block; margin: 0 20px; width: 150px; color: #FF3F00; font-weight: bold; text-align: center;}
#Point li img { margin-bottom: 20px; width: 140px; height: auto;}

/* Information */
#Information .left { vertical-align: middle; }
#Information h2 { margin-bottom: 40px; text-align: left;}
#Information li a span { display: inline-block; margin-right: 30px;}
#Information li { overflow: hidden; margin: 0 0 10px 0; max-width: 600px; text-overflow: ellipsis; white-space: nowrap; }

#Information .cols .penguin1 { margin: 0 20px; width: 190px; height: auto; vertical-align: middle; }

#Information .cols:nth-of-type(3) { text-align: center;}
#Information .cols .contact { display: inline-block; padding-top: 25px; width: 200px; height: 200px; color: #FFF; font-size: 21px; background: #DF3800; border-radius: 50%;}
#Information .cols .contact b { font-size: 16px; font-weight: bold;}
#Information .cols .contact img { margin: 10px 0; width: 74px; height: auto;}
#Information .cols form  input { display: inline-block; width: 70%; max-width: 300px; margin-left: 40px;}
#Information .cols .contact:hover { background: #D03400;}

.wp-article .list-line ul,
.wp-article .list-image ul,
.wp-article .list-photo ul { margin: 0 auto;}

/* .list-line */
.list-line { margin: 0; padding: 0; border-bottom: 1px solid #CCC;}
.list-line li { display: block; margin: 0; padding: 0; list-style: none;}
.list-line li a { display: block; padding: 12px 15px 11px; color: #666; font-size: 16px; line-height: 1; border-top: 1px solid #CCC;}
.list-line li a:hover { color: #FFF;}
.list-line li:nth-of-type(2n+1) a { background: #EFEFEF; }
.list-line li ul { margin-bottom: 0; padding-bottom: 24px;}
.list-line li li:nth-of-type(2n+1) a { background: #FFF;}
.list-line li a:hover, .list-line li li a:hover{ background: #333; border: none;}

/* .list-image */
.list-image { margin: 0; }
.list-image li { display: inline-block; margin: 20px; width: 180px; font-size: 14px;}
.list-image li a { color: #666;}
.list-image li a:hover { color: #DF3800;}

/* .list-photo */
.list-photo { clear: both; margin: 0 0 40px ; padding: 0; width: auto; text-align: left;}
.list-photo li { display: inline-block; margin: 0 30px 30px 0; padding: 0 30px 0 0; text-align: center; vertical-align: top; border-right: 1px solid #DDD;}
.list-photo li:nth-of-type(1) { padding-left: 0;}
.list-photo li:last-of-type { border: none;}
.list-photo li img { width: auto; height: 160px;}

/* gallery */
.single .wp-article ul.gallery { margin: 0 auto;}
.single .wp-article .gallery li { overflow: hidden; display: inline-block; margin-right: 15px; width: auto; height: 100px; list-style: none;}
.single .wp-article .gallery li img { width: auto; height: 100px;}

/* wp検索 */
#Search input { max-width: 300px; color: #FFF; background: #111111; border: none;}
#Search input::-webkit-input-placeholder { color: #555;}
#Search input:-ms-input-placeholder { color: #555;}
#Search input::-moz-placeholder {  color: #555;}
#Search input:hover::-webkit-input-placeholder { display: none;}
#Search input:hover:-ms-input-placeholder { display: none;}
#Search input:hover::-moz-placeholder { display: none;}

.box-w #Search input { margin-left: 40px; width: 200px; color: #333; background: #FFF; border: 1px solid #CCC;}
#NotFound #Search input { margin-left: 50px; }

 
/* バナー */
.banners div.box { display: table; margin: 0 auto; padding: 0; }
.banners div div { margin: 0; display: table-cell; text-align: center; vertical-align: middle; border-right: 1px solid #333;}
.banners a { display: block; vertical-align: middle;}
.banners div div:nth-of-type(1) { border-left: 1px solid #333;}
.banners p { margin: 0;  font-size: 24px; color: #FFF; letter-spacing: 0.1em;}
.banners p span { color: #FF3F00;}
.banners h3 { display: inline-block; margin: 0; font-size: 32px; font-weight: normal;}
.banners h3:hover { color: #FF3F00;}
.banners img { margin-bottom: 20px; width: 80px; height: auto;}

.banners.col3 div div { width: 33%;}
.banners.col4 div div { width: 25%;}

#TopB h3 { font-size: 24px;}
#TopB p { font-size: 17px;}
#BottomB { padding: 100px 0; background: #0D0D0D;}

.bn-lightbox { display: block; padding:0  10% ; margin-bottom: 120px; text-align: center;}
.bn-lightbox img { width: 100%; max-width: 650px; height: auto; text-align: center;}

/* slider */
.slider { position: relative; overflow: hidden; margin: 0; padding: 0; width: 100%; height: 100%;}
.slider .set { margin: 0; padding: 0; width: 100%; height: 100%; list-style: none; transition: transform .5s ease;}
.slider .set .slide { float: left; display: table; margin: auto; padding: 0; width: 100%; height: 100%; text-align: center; vertical-align: middle;}
.slider-arrow { margin: 0; padding: 0; list-style: none;}
.slider-arrow-prev,
.slider-arrow-next { position: absolute; top: 50%; display: block; margin-top: -20px;}
.slider-arrow-prev button,
.slider-arrow-next button { padding: 0; cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}
.slider-arrow-prev button[disabled],
.slider-arrow-next button[disabled] { opacity: .5;}
.slider-arrow-prev button:before,
.slider-arrow-next button:before { display: block; width: auto; height: 40px; content: '';}
.slider-arrow-prev { left: 10px; z-index: 781;}
.slider-arrow-prev button:before { background: url(/images/common/arrow-whiteL.png) no-repeat; background-size: auto 40px;}
.slider-arrow-next { right: 10px; z-index: 782;}
.slider-arrow-next button:before { background: url(/images/common/arrow-whiteR.png) no-repeat; background-size: auto 40px;}
.slider-dots { position: absolute; right: 0; bottom: 60px; left: 0; margin: 0; padding: 0; list-style: none; text-align: center;}
.slider-dots span { display: inline-block; margin: 0 5px;}
.slider-dots button { padding: 0; cursor: pointer; color: transparent; border: none; outline: none; background: transparent;}
.slider-dots button:before{ display: block; width: 8px; height: 8px; content: ''; border-radius: 50%; background: rgba(255, 255, 255, .5);}
.slider-dots button.active{ opacity: .5;}


/* 文字装飾 */

.h-eng { letter-spacing: 0.1em;}

.tx18 { font-size: 18px;}
.tx16 { font-size: 16px;}
.tx14 { font-size: 14px;}

.red { color: #F33;}
.red::selection { background: #FAE7E7;}
.red::-moz-selection { background: #FAE7E7}


/* マージン */
.mr50 { margin: 0 50px 0 0;}
.mr80 { margin: 0 80px 0 0;}
.mr100 { margin: 0 100px 0 0;}
.mb20 { margin-bottom: 20px;}
.mb30 { margin-bottom: 30px;}
.mb40 { margin-bottom: 40px;}
.mb60 { margin-bottom: 60px;}


/*-------------------------------------
	ブラウザハック
-------------------------------------*/

/* ie 8以下*/

*{ text-shadow: none \9;}
a.btn:after { display: none \9;}



/*-----------------------------------------
	header ヘッダ（共通） 
-----------------------------------------*/

header{ position: absolute; top: 0; margin: 0; padding: 0; width: 100%; text-align: left; vertical-align: middle; z-index: 800; background: rgba(0,0,0,0.9);}
header .logo { margin: 0; padding: 0; display: inline-block; vertical-align: top; line-height: 1;}
header .logo img { margin: 22px 50px 0 30px; display: inline-block; width: 250px; height: auto; vertical-align: top; }


/*-------------------------------------
	navigation
-------------------------------------*/

header nav { display: inline-block; margin: 0 auto; width: auto; text-align: left;}
header nav ul { display: table; margin: 0 ; width: auto;}
header nav li { display: table-cell; padding: 10px;}
header nav a { display: inline-block; padding: 10px 5px; font-size: 17px; line-height: 1;}
header nav a:visited { color: #FFF;}
header nav a:hover,
header nav li.subnavi:hover { color: #FF3F00; }
header nav li.subnavi ul li a:hover { color: #FFF;} 

/* 固定 fix */
header.fixed:not(.spnav) { position: fixed; top: 0; left: 0; margin: 0 auto; animation-iteration-count: 1; animation: gn 0.2s; transition-timing-function: ease; z-index: 899;}
	@keyframes gn { 0% { transform: translate(0px, -50px); opacity: 0.5;} 40% { opacity: 1;} 100%  { transform: translate(0px, 0px);} }


/* 高さが短い環境 */
header .spnav ul { display: none;}
header .spnav { position: fixed; right: 0; top: 0; margin: 0; width: 60px; height: 58px; background: #333; box-shadow: 0 0 5px rgba(100, 100, 100, 0.2); z-index: 805;}
header .spnav.fixed { box-shadow: 0 0 5px rgba(100, 100, 100, 0.2); }

.spnav .icon { overflow: hidden; position: fixed; right: 0; top: 2px; display: block; padding: 0 14px 12px 14px; width: 60px; height: 53px; cursor: pointer; z-index: 860;}
.spnav .icon span { position: absolute; display: block; margin-top: 14px; width: 34px; height: 2px; background: #EEE; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out;}
.spnav .icon span:nth-child(1) { top: 0; }
.spnav .icon span:nth-child(2) { top: 11px;}
.spnav .icon span:nth-child(3) { top: 22px;}

header.sp .logo { display: none; }
.spnav li { display: none;}
.spnav li.current a { color: #999;}

header.open .logo { display: block; margin: 0 auto; width: 100%; text-align: center;}
header.open .logo a { position: relative; top: 0; display: inline-block; margin: 0; padding: 0; width: auto; z-index: 806;}
.open .spnav .icon span:nth-child(1) { top: 11px; -webkit-transform: rotate(315deg); -moz-transform: rotate(315deg); transform: rotate(315deg); }
.open .spnav .icon span:nth-child(2) { width: 0; left: 50%; }
.open .spnav .icon span:nth-child(3) { top: 11px; -webkit-transform: rotate(-315deg); -moz-transform: rotate(-315deg); transform: rotate(-315deg); }
.open .spnav .icon span { -moz-transform: translateY(556px); -webkit-transform: translateY(556px); transform: translateY(556px); }

.open .spnav { width: 100%; padding-top: 56px; height: auto; background: #000;}
.open .spnav ul { display: block; position: fixed; left: 0; top: 56px; overflow-x : hidden; overflow-y: scroll; display: block; width: 100%; height: auto; background: none; z-index: 801; animation-iteration-count: 1; animation: spnav 0.2s; transition-timing-function: ease; }
	@keyframes spnav { 0% { transform: translate(0px, -50px); opacity: 0.5;} 40% { opacity: 1;} 100%  { transform: translate(0px, 0px);} }
.open .spnav li { display: block; background: rgba(0,0,0,0.9);}
.open .spnav li { display: block !important; padding: 0; width: 100%; height: auto; text-align: center; border-bottom: 1px solid #333;}
.open .spnav li a { margin: 0 auto; padding: 10px; width: 100%; font-size: 15px; text-align: center; vertical-align: middle; line-height: 1; }
.open .spnav li a span { display: block;}
.spnav li img { display: none;}

/* subnavi */
.subnavi { position: relative;}
.subnavi li { font-size: 20px; font-weight: bold;}
.subnavi li a { color: #FFF;}
.subnavi li a:hover { opacity: 0.6;}
.subnavi li i { display: block; margin-bottom: 10px; color: #FFF; font-size: 40px; vertical-align: middle;}
/*.subnavi .main { margin-bottom: 35px; padding-bottom: 10px; border-bottom: 1px solid #E36A42; }*/
.subnavi .main li { float: left; display: block; width: 25%; max-width: 350px; font-weight: bold;}
.subnavi .sub { display: inline-block; margin-right: 50px;}
.subnavi .sub b { display: block; margin-bottom: 10px; color: #F5AE96; font-size: 20px; letter-spacing: 0.12em; font-weight: normal; }
.subnavi .sub li { float: none; display: block; margin: 5px 0; padding: 0; font-size: 14px; font-weight: normal; }
.subnavi .sub li a { margin: 0; padding: 0 0 0 20px; background: url(/images/common/arrow-whiteR.png) 2px 2px no-repeat; background-size: auto 12px;}


.subnavi .products,
.subnavi .brand { position: fixed; left: 0 ; top: 60px; display: block; padding: 35px 40px 30px; width: 100%; background: #C30; z-index: 892;}

.subnavi .products::before { content: ""; position: absolute; top: -7px; left: 380px; display: block; width: 17px; height: 7px; background: url(/images/common/icon-subnavi.png) left top; background-size: 17px auto;}
.subnavi .products .main li a { display: block; padding: 0  10px 0 95px; height: 100px;}
.subnavi .products .main li:nth-of-type(1) a { background: url(/images/common/submenu-01.png) left top no-repeat;}
.subnavi .products .main li:nth-of-type(2) a { background: url(/images/common/submenu-02.png) left top no-repeat;}
.subnavi .products .main li:nth-of-type(3) a { background: url(/images/common/submenu-03.png) left top no-repeat;}
.subnavi .products .main li:nth-of-type(4) a { background: url(/images/common/submenu-04.png) left top no-repeat;}
.subnavi .products .main li:nth-of-type(5) a { background: url(/images/common/submenu-05.png) left top no-repeat;}
.subnavi .products .main li:nth-of-type(6) a { background: url(/images/common/submenu-06.png) left top no-repeat;}
.subnavi .products .main li:nth-of-type(7) a { background: url(/images/common/submenu-07.png) left top no-repeat;}


.subnavi .brand::before { content: ""; position: absolute; top: -7px; left: 484px; display: block; width: 17px; height: 7px; background: url(/images/common/icon-subnavi.png) left top; background-size: 17px auto;}
.subnavi .brand li a { font-size: 18px;}


.spnav .subnavi ul li { background: none; border: none;}
.open .spnav li { font-size: 15px;}
.spnav .subnavi .main { margin-bottom: 0; padding-bottom: 5px;}
.spnav .subnavi .main li { width: 100%; max-width: none; font-weight: normal;}
.spnav .subnavi .main li i { display: inline-block; margin-right: 10px; font-size: 15px; }
.spnav .subnavi .sub  { display: none;}
.spnav .subnavi .products,
.spnav .subnavi .brand { position: relative; top: inherit; margin: 0; padding: 0; background: none;}
.spnav .subnavi .products .main li,
.spnav .subnavi .brand li { float: none; display: block; width: 100%;}
.spnav .subnavi .products .main li a,
.spnav .subnavi .brand li a { margin-left: 20px; padding: 0; width: 100%; height: auto; text-align: left; background: none;}
.spnav .subnavi .products::before,
.spnav .subnavi .brand::before { display: none;}
.spnav .subnavi .products ul,
.spnav .subnavi .brand ul { overflow-y: auto; position: relative; top: inherit; margin: 3px 0 0 0; padding: 0; background: none;}
.spnav .subnavi .brand li a { margin-top: 3px; padding: 0 5px ; font-size: 16px; font-weight: normal;}

.open .spnav .sub2 { padding: 5px 0;}
.open .spnav .sub2 ul { margin-bottom: 4px;}

/*-------------------------------------
	Breadcrumbs
-------------------------------------*/

#Breadcrumbs { position: absolute; left: 10px; bottom: 20px; font-size: 13px; line-height: 1; text-align: left;}
#Breadcrumbs li { display: inline-block; margin: 0; padding: 0 12px 0 20px; vertical-align: text-top; background: url(/images/common/arrow-lightgray.png) left 3px no-repeat; background-size: auto 12px;}
#Breadcrumbs li:nth-of-type(1) { background: none;}
#Breadcrumbs img { margin-top: 1px; width: 16px; height: auto; opacity: 0.5; vertical-align: text-top;}
#Breadcrumbs img:hover { opacity: 1;}
#Breadcrumbs a:hover { color: #FFF; }


/*-------------------------------------
	Visual
-------------------------------------*/

#Visual { position: relative; display: table; margin: 0; padding: 0; width: 100%;}
#Visual h1, .products #Visual em { display: table-cell; margin: 0; padding: 40px 0 0 0; width: 100%; height: 320px; color: #FFF; font-size: 54px; font-weight: bold; letter-spacing: 0.15em; vertical-align: middle; background:url(/images/common/BG-visual-2nd.png) top -50px center repeat-x; text-shadow: 0 2px 5px rgba(0,0,0,0.8);}
.black #Visual { margin-bottom: 80px;}
#Home #Visual { overflow: hidden; position: relative; display: block; margin: 0; padding: 0; width: 100%; height: auto; min-height: 100%; background: url(/images/common/BG-visual-2nd.png) center top repeat-x;}
#Home #Visual h1,
#Home #Visual h2,
#Home #Visual h3,
#Home #Visual p { text-shadow: 0 2px 5px rgba(0, 0, 0, 0.8); line-height: 140%; letter-spacing: normal;}
#Home #Visual h2 { display: block; margin: 20vh auto 8vh; padding: 0; height: auto; font-weight: normal; font-size: 40px; background: none;}
#Home #Visual figure { margin-bottom: 7vh;}

@media screen and
(max-width: 768px),
screen and (orientation: portrait) {
	#Home #Visual { min-height: inherit;}
	#Home #Visual h2 { margin: 10vh auto 5vh;}
}
@media screen and
(min-height: 1200px),
(max-width: 1200px) and (min-height: 900px),
(max-width: 1100px) and (min-height: 850px),
(max-width: 1000px) and (min-height: 800px) {
	#Home #Visual { min-height: inherit;}
}

#Home #Visual h2 { font-size: 44px; line-height: 135%;}
#Home #Visual figure { display: block; width: 100%;}
#Home #Visual figure img { width: 80%; max-width: 1400px; height: auto;}
#Home #Visual .slider .slide > div { display: table-cell; height: 100%; vertical-align: middle;}
#Home #Visual .sd-1 h1 { margin: 40px auto; height: auto;}
#Home #Visual .sd-1 figure img { width: 90%;} 
#Home #Visual .sd-2 figure img { max-width: 1100px;}
#Home #Visual .sd-3 figure img { width: 90%; max-width: 1200px;}
#Home #Visual .sd-4 p { margin: 20px auto; font-size: 36px;}
#Home #Visual .sd-4 figure img { width: 80%; max-width: 1140px;}
#Home #Visual .sd-4 h3 { margin-bottom: 60px; font-size: 40px;}
#Home #Visual .sd-4 .btn-box ul { margin: 40px auto 0;}
#Home #Visual .sd-4 .btn-box li { padding: 10px;}
#Home #Visual .sd-4 .btn-box li a { font-size: 16px; width: 200px;}

.products #Visual h1 { padding-top: 125px;}
.products #Visual em { padding-top: 60px; }

/*-------------------------------------
	page
-------------------------------------*/

/* Home */
#Home article { margin-top: 0;}

#Home #AboutProducts .illust img { margin: 0 20px 30px; vertical-align: top;}
#Home #AboutProducts h3 { font-size: 23px;}
#Home #AboutProducts h4 { margin-bottom: 20px;}

#AboutProducts p.illust img { width: auto; height: 175px;}
#AboutProducts p.illust img:nth-of-type(5),
#AboutProducts p.illust img:nth-of-type(6) { height: 145px;}

#Home #NewArrivals { padding-bottom: 120px;}

/* Products */
#Products #Categories h3 { font-size: 18px;}
#Products #Categories li:nth-of-type(1) h3, #Products #Categories li:nth-of-type(2) h3 { letter-spacing: -0.15em;}
#Products #Categories figure { height: auto;}
#Products #AboutProducts h3 { margin-bottom: 40px;}
#Products #AboutProducts h3 + p { margin-bottom: 60px;}

/* Penguin */
.penguin2nd article .box-w h3 { margin-top: 60px; padding-top: 60px; border-top: 1px solid #CCC;}
.penguin2nd article .box-w h4 { margin: 20px 0;}
.penguin2nd .box-w .list { text-align: left;}
.penguin2nd .box-w .list ul li { margin: 0 20px 0 0 !important; text-align: center;}
.penguin2nd .box-w .list ul li a { width: auto; min-width: inherit; }
.penguin2nd .box-w .list ul li img { width: auto; height: 140px;}

#Variation .box-w h3 { margin: 80px 0; font-size: 30px; font-weight: 600; text-align: center;}
#Variation .box-w h4 { margin-top: 0;}
#Variation .left { margin: 0; width: 50%; padding-right: 60px;}
#Variation .right { padding-left: 50px;}
#Variation .box-w li { margin: 10px 0;}
#Variation .col2 th { width: 130px;}

#Setup .left { width: 440px;}
#Setup .left img { margin: 0 20px 60px 0; width: 200px; height: auto; }
#Setup .right { padding-left: 40px;}
#Setup p.asterisk { margin-bottom: 40px;}

#Print .box-w h4 { margin-top: 0;}
#Print .disc { margin-bottom: 30px;}
#Print .disc li { margin-bottom: 20px;}
hr.dot, #Print .box-w hr { border-top: 2px dotted #CCC;}
#Print .box-w hr { margin: 60px 0;}

/* Download */
#Download .box-w h3 { margin-top: 100px;}
#Download .btn-box li { width: 20%;}

/* FAQ*/
#FAQ .box-w li { margin-bottom: 60px; padding-bottom: 60px; border-bottom: 1px solid #CCC; list-style: none;}
#FAQ .box-w li p:last-child { margin-bottom: 0;}
#FAQ .wp-article .box-w h4 { font-size: 22px;}
#FAQ .wp-article ul { margin-left: 0;}

/* Company */
#Company article h3 { text-align: center;}
#Company article section iframe { margin: 60px 0 100px 0;}
#Company .box-w { padding-bottom: 0 !important;}
#AccessMap { color: #333; background: #FFF;}
#AccessMap h3 { color: #333; font-weight: bold;}
#Map { height: 550px; border-top: 1px solid #EFEFEF;}

/* Contact */
#Contact table { margin:  0 auto; width: 100%; border: none; }
#Contact th, #Contact td { background: none; border: none;}
#Contact th { position: relative; width: 240px; text-align: left; vertical-align: middle; font-weight: normal;}
#Contact form input[type=submit] { padding: 10px; color: #FFF; font-size: 18px; background: #333; border: none; border-radius: 30px;}
#Contact form input[type=submit]:hover { background: #E03819; border: none !important;}

div.wpcf7-response-output { padding: 10px 10px 10px 15px; width: 100%; font-size: 14px; text-align: center; border-radius: 4px; }
.wpcf7-not-valid-tip { display: block; margin-left: 240px; font-size: 13px !important;}
fieldset .wpcf7-not-valid-tip { margin-left: 0;}
#Contact form .capimg,
#Contact form .capimg img { vertical-align: middle;} 
#Contact form .cap { margin-left: 15px; width: 100px; vertical-align: middle;}

/* diy */
#DIY .aligncenter { margin: 30px auto 40px;}
#DIY .center { margin: 40px auto 60px;}
#DIY .list-photo li img { height: 80px;}

/* rental */
#Rental h2 + .center { margin: 40px 0 60px;}
#Rental .note + .center { margin: 30px 0 60px;}
#Rental .box-border img { width: auto; max-height: 320px;}

/* Privacy */
#Privacy h3 { margin-bottom: 20px;}
#Privacy h4 { margin-top: 10px;}

/* #Information */
body#Information h2 { text-align: center;}
body#Information h3 { text-align: left; margin-bottom: 20px;}
body#Information li { max-width: none;}
body#Information article .box div { margin-bottom: 50px;}

/* #SearchResult */
#SearchResult h2 { margin-bottom: 40px; font-size: 30px;}
#SearchResult .result { margin: 0 auto; width: 100%; text-align: center;}
#SearchResult .result ul { margin: 0 auto; width: 75%;}
#SearchResult .result li { margin: 0; padding: 20px 0 0; border-bottom: 1px dotted #CCC;}
#SearchResult .result li a { display: block; margin: 0; padding: 0 10px 0; color: #333; text-align: left; border: none;}
#SearchResult .result h3 { display: inline-block; margin: 0 0 10px; padding: 5px 0 0 20px; font-size: 18px; vertical-align: middle; border: none; background: url(/images/common/arrow-orange.png) left 5px no-repeat; background-size: 8px auto; }
#SearchResult .result p { font-size: 16px; text-align: left;}
#SearchResult .result .category { display: inline-block; margin: 0 0 0 12px; vertical-align: top; }
#SearchResult .result .category span { display: inline-block; padding: 3px 5px; font-size: 11px; color: #FFF; line-height: 1; background: #AAA; border-radius: 3px;}

/* #NotFound */
#NotFound a.btn { padding: 0; width: 80px; min-width: inherit; height: 80px; font-size: 15px; line-height: 80px; border-radius: 50%;}


/*-----------------------------------------
	footer
-----------------------------------------*/

#PageTop { position: fixed; bottom: 0; display: block; margin: 0 auto; padding: 0;  width: 100%; text-align: center; line-height: 1; z-index: 200;}
#PageTop a { display: inline-block; margin: 0 auto; padding: 0; width: 230px; height: 32px; font-size: 16px; line-height: 32px; text-align: center; letter-spacing: 0.2em; background: #D03400;}
#PageTop a:hover { color: #FFF; opacity:0.6;}
#PageTop a:visited { color: #FFF; opacity: 1;}

footer { position: relative; margin: 0 auto; padding: 0; font-size: 15px; background: url(/images/BG-footer.png) bottom 50px center repeat-x; }
footer nav div:nth-of-type(1) { width: 33%; padding-top: 10px; text-align: left;}
footer nav div:nth-of-type(2) { width: 32%;}
footer nav div:nth-of-type(3) { width: 20%;}
footer nav div:nth-of-type(4) { width: auto;}
footer nav div img { width: 250px; height: auto;}

footer h3{ margin: 0 0 20px; color: #FF3F00; font-weight: normal; font-size: 20px; text-align: left;}
footer nav { display: table; margin: 0 auto; padding: 120px 0 90px; text-align: center;}
footer nav div { display: table-cell; padding: 0; vertical-align: top; }
footer nav li { margin: 4px 0;}
footer .current a { color: #777;}
footer .current a:hover { color: #E03819;}

.copyright { margin: 0 auto; padding: 0; height: 50px; color: #666; font-size: 10px; line-height: 50px; background: #0D0D0D;}


/*-------------------------------------
			media query
-------------------------------------*/


@media screen and (max-width:1200px) {
	.list li { width: 33%; margin-bottom: 30px; }

	article .col2 { width: 100%;}
	#TopB h3 { font-size: 20px;}
	#BottomB h3 { font-size: 22px;}
	#BottomB p { font-size: 20px;}

}
@media screen and (max-width:1024px) {
	.black article section:not(.banners),
	.banners .box,
	#Visual .btn-box,
	footer nav {
		margin-left: auto;
		margin-right: auto;
		width: 90%;
		max-width: 1200px;
		}

	article hr,
	article .box,
	article .table-set { width: 100%;}

	.clbr { display: none;}

	article section { padding-bottom: 150px;}

	header nav li { padding: 10px 6px;}
	header .logo img { width: 220px; margin-right: 20px;}

	.subnavi .products::before { left: 314px; }
	.subnavi .brand::before { left: 410px; }

	footer nav div { width: auto !important;}
	footer nav div img { width: 150px;}

	.banners { padding: 60px 0 80px;}
	.banners.col4 div div { height: auto; padding: 10px 5px; vertical-align: top;}
	#TopB h3 { font-size: 18px;}
	#TopB p { font-size: 16px;}

	#BottomB h3 { font-size: 20px;}
	#BottomB p { font-size: 18px;}

	#Visual .slider, #Visual slider { height: 800px;}

	#Visual h1, .products #Visual em { font-size: 48px;}
	.products #Visual h1 { padding-top: 125px; font-size: 19px;}
	.products #Visual em { padding-top: 50px; }

	
	.list li { padding: 0 15px;}
	.list.new li::before { left: 15px;}
	.list li .category i { margin-bottom: 15px;}
	#Point { display: table; width: 100%;}
	#Point li { display: table-cell; margin: 0; padding: 0 20px;}
	#Point li img { width: 100px;}
	.table-set { display: block;}
	.table-set .cols { display: block;}
	
	.btn-box li { margin-bottom: 5px; padding: 0;}
	.list-photo li img { height: 100px;}

	#Information .table-set { text-align: left;}
	#Information .cols:nth-of-type(2),
	#Information .cols:nth-of-type(3) { margin-top: 60px; display: inline-block; width: auto;}
	#Information .cols:nth-of-type(3) { min-width: 320px;}
	#Information .cols .penguin1 { width: 160px; margin-right: 60px; }


	/* page */
	#Home article { margin-top: 5vh;}
	#Home #Visual,
	.slider,
	.slider .set { height: auto;}
	/*#Visual .sd-1 { padding-top: 80px;}
	#Home #Visual h2 { font-size: 42px;}
	#Visual .sd-2, #Visual .sd-3, #Visual .sd-4 { padding-top: 120px;}*/
	#Home #Visual h2 { font-size: 36px;}
	#Home figure { margin-bottom: 5vh;}
	#Home #AboutProducts h3 { text-align: left;}
	#AboutProducts p.illust img { margin: 0 10px 20px; height: 100px;}
	#AboutProducts p.illust img:nth-of-type(5),
	#AboutProducts p.illust img:nth-of-type(6) { height: 85px;}
	#Company article section iframe { margin-top: 0; margin-bottom: 40px; }
	#Contact .clbr { display: block;}


}
@media screen and (max-width:900px) {

/*	header .logo img { width: 180px;}

	.subnavi .products::before { left: 314px; }
	.subnavi .brand::before { left: 410px; }

	footer nav { padding: 60px 0;}
	footer nav div:nth-of-type(1){ display: none;}*/


	#Visual h1, .products #Visual em { padding:0;}
	.products #Visual h1 { padding-top: 115px;}
	.products #Visual em { padding-top: 0; }
	.products .brands { margin-top: 60px;}

	/* page */
	#Home #Visual figure img { width: 90%;	}
	#Company .wp-article iframe{ width:100%; max-width:100%; }


}
@media screen and (max-width:780px) {

	article .col2 .left table { border: none;}
	article section { padding-bottom: 100px;}

/*	#Visual .slider, #Visual slider { height: 760px;}
	#Visual h1, .products #Visual em { height: 280px;}
	#Visual h1 { padding-top: 10px; font-size: 40px;}*/

	#Visual h1, .products #Visual em { font-size: 40px;}
	.products #Visual h1 { padding-top: 110px;}
	.products #Visual em { padding-top: 14px; }
	
	#Breadcrumbs { overflow: auto; -webkit-overflow-scrolling: touch; margin: 0; padding: 0; width: 90%; white-space: nowrap; box-sizing: border-box; }
	#Breadcrumbs li:nth-of-type(1) { padding-left: 10px;}
	#Breadcrumbs li:last-child { margin-right: 80px;}

	footer nav { display: block; padding: 60px 0 40px;}
	footer nav h3 { margin: 0;}
	footer nav div { clear: both; display: block; margin-bottom: 20px; width:100%;}
	footer nav div li { float: left; width: 50%;}
	footer nav div::after { clear:both; visibility:hidden; content:'.'; display:block; height:0; }

	.banners.col4 h3 { padding: 0 8px; text-align: left;}
	#BottomB h3 { font-size: 16px;}
	#BottomB p { font-size: 14px; font-weight: bold;}

	.btn-box li { float: left; margin: 0;  padding: 0 10px; width: 50%; height: auto; box-sizing: border-box;}
	.btn-box li a { display: block; margin: 0; padding: 10px 5px; width: 100%; height: auto; text-align: left; border: none; border-bottom: 1px solid #333;}
	.list li figure img { width: auto; height: 120px}
	.list-image li,
	.list-photo li { float: left; display: block; margin: 20px 0; padding: 0 10px;}

	.single .wp-article h2 { margin-bottom: 20px;}
	.single .wp-article ul.icons { margin: 0 auto;}

	.brands ul.submenu { display: block; margin: 0 0 40px 0; border: none;}
	.brands ul.submenu li { display: inline-block; width: 46%; text-align: left; border: none;}

	/* page */
	#Home article { margin-top: 1vh;}
/*	#Home #Visual .sd-4 .btn-box li { padding: 0 10px;}
	#Home #Visual h2 { font-size: 34px;}
	#Home #Visual .sd-4 p { font-size: 30px;}
	#Home #Visual .sd-4 .btn-box li a { width: 100%;}*/
	#Home #NewArrivals { padding-bottom: 50px;}
	#Home #AboutProducts { padding-bottom: 100px;}
	#Home #Visual figure img { width: 98%;	}
	#Home #Visual h2 { font-size: 30px;}
	#Home #AboutProducts .illust img { margin: 0 10px 10px;}
	#Point { margin-bottom: 40px;}
	#Point li { margin: 0 10px; width: 14%; font-size: 14px; text-align: left; vertical-align: top;}
	#Point li img { width: 90%; vertical-align: top;}
	#Download .btn-box { border: none;}
	#Download .btn-box li { padding: 5px; width: 48%; border: none; text-align: left; border-bottom: 1px solid #CCC; background: none; box-sizing: border-box;}
	#Download .btn-box li:nth-of-type(1),
	#Download .btn-box li:nth-of-type(2){ border-top: 1px solid #CCC;}
	#Download .btn-box li:nth-of-type(2n+1) { margin-right: 10px;}
	#Download .btn-box li:nth-of-type(2n+2) { margin-left: 10px;}

}
@media screen and (max-width:680px) {

	#Point::after {  clear:both; visibility:hidden; content:'.'; display:block; height:0; }
	.clbrsp { display: none;}

	article section { padding-bottom: 60px;}
	.box-w { padding: 60px 20px 100px !important;}
	.wp-article h1, .wp-article h2 { font-size: 26px;}
	.products #Visual h1 { padding-top: 55px;}
	.products #Visual em { padding-top: 5px; }

	footer { background: none; }
	footer nav div li { float: none; width: 100%; font-size: 14px;}
	footer #PageTop a { width: 100%;}
	footer nav div:nth-of-type(1) { display: none;}
	footer nav div:nth-of-type(2) h3 { margin-top: 30px;}

	#Visual h1, .products #Visual em { height: 180px;}
	#Visual h1 { font-size: 22px;}
	.products #Visual h1 { top: 0; font-size: 14px;}
	.products #Visual em { font-size: 22px;}
	.products h3.h-eng { font-size: 36px;}
	.brands ul.submenu li { width: 96%;}
	.products ul.submenu li { font-size: 18px; border-bottom: 1px solid #444;}
	.products ul.submenu li:nth-of-type(1) { border-top: 1px solid #444;}
	.products ul.submenu li span { font-size: 12px;}

	.wp-article .btn-back { display: table; right: 0; margin: 0 0 32px 0; padding: 0; width: 100%; background: #333;}
	.wp-article .btn-back p { display: table-cell; margin: 0; width: 33%; height: 40px; vertical-align: middle; border-right: 1px solid #555; }
	.wp-article .back-bak a,
	.wp-article .back-brd a,
	.wp-article .back-pro a { display: block; width: 100%; height: auto; font-size: 12px; border-radius: 0;}
	.wp-article .btn-back p a br { display: none;}
	.wp-article .back-brd a img,
	.wp-article .back-pro a img, 
	.wp-article .back-bak a img { margin: 0 6px 3px 0; width: auto; height: 12px; vertical-align: middle;}

	.banners { padding: 40px 0 !important;}
	.banners.col3 div, .banners.col4 div { clear: both; display: block; text-align: left;}
	.banners.col3 div div, .banners.col4 div div { display: block; margin: 0; padding: 10px; width: 100%; text-align: left; border-left: none !important; border: none; border-top: 1px solid #333;}
	.banners div div a p:nth-of-type(1) { float: left; }
	.banners.col3 div div:nth-of-type(1) { border-top: none;}
	.banners.col4 div div:nth-of-type(4) { border-bottom: 1px solid #333;}
	.banners img { margin-bottom: 10px; padding-right: 20px; }
	.banners p { padding-top: 5px;}
	.banners p:nth-of-type(1) { padding-top: 0;}
	#TopB { margin-bottom: 50px;}
	#BottomB { padding: 15px 0;}
	.bn-lightbox { margin-bottom: 80px;}

	.list li { width: 50%;}
	.list-photo li img { height: 60px;}
	.list-line li a { line-height: 130%;}
	.list-image li { width: 33%;}
	
	#Point { display: block; margin-bottom: 20px;}
	#Point li { float: left; display: block; margin: 0 0 10px; padding: 5px 10px 0 60px; width: 50%; height: 50px;}
	#Point li:nth-of-type(1) { background: url(/images/common/img-point1.png) left top no-repeat; background-size: 50px auto;}
	#Point li:nth-of-type(2) { background: url(/images/common/img-point2.png) left top no-repeat; background-size: 50px auto;}
	#Point li:nth-of-type(3) { background: url(/images/common/img-point3.png) left top no-repeat; background-size: 50px auto;}
	#Point li:nth-of-type(4) { background: url(/images/common/img-point4.png) left top no-repeat; background-size: 50px auto;}
	#Point li:nth-of-type(5) { background: url(/images/common/img-point5.png) left top no-repeat; background-size: 50px auto;}
	#Point li img { display: none;}
	
	#Information form { margin-top: 0;}
	#Information .cols:nth-of-type(2),
	#Information .cols:nth-of-type(3) { display: block; margin-top: 20px; margin-bottom: 30px;}
	#Information .cols .penguin1 { margin: 0 auto; width: 100px;}

	/* page */
	#Home article { margin-top: 0;}
	#Visual .slider, #Visual slider { height: 500px;}
	#Home #Visual { background-size: auto 70%;}
	#Home #Visual h1,
	#Home #Visual h2{ padding-left: 40px; padding-right: 40px; font-size: 24px; line-height: 150%; text-align: left;}
/*	#Home #Visual .sd-4 p,
	#Home #Visual .sd-4 .btn-box li a { font-size: 14px;}
	#Visual .sd-1 { padding-top: 20px;}
	#Visual .sd-2, #Visual .sd-3 { padding-top: 100px;}
	#Visual .sd-4 { padding-top: 40px;}
	#Visual .sd-2 h2,
	#Visual .sd-3 h2 { margin-bottom: 40px;}

	#Home #Visual .sd-4 h3 { padding-left: 40px; padding-right: 40px; font-size: 24px; line-height: 150%; text-align: left;}
	#Home #Visual .sd-4 h3 { margin-bottom: 20px;}
	#Home #Visual .sd-4 p { margin-bottom: 10px;}
	#Home #Visual .sd-4 .btn-box ul { margin-top: 20px;}
	.slider-arrow-prev,
	.slider-arrow-next { top: 80%; padding: 0; margin: 0;}*/

	#Home #AboutProducts h3 { font-size: 18px;}
	#Home #AboutProducts .illust img { margin: 0 5px;}
	#AboutProducts p.illust img { height: 56px;}
	#AboutProducts p.illust img:nth-of-type(5),
	#AboutProducts p.illust img:nth-of-type(6) { height: 52px;}
	#Download .btn-box li { width: 100%;}
	#Download .btn-box li:nth-of-type(2){ border-top: none;}
	#Download .btn-box li:nth-of-type(2n+1) { margin-right: 0;}
	#Download .btn-box li:nth-of-type(2n+2) { margin-left: 0;}

}
@media screen and (max-width:580px) {
	body { font-size: 15px;}
	h1, h2, h3, h4, h5, h6 { margin-bottom: 20px; }
	h1 { font-size:30px;}
	h2 { font-size:30px;}
	h3 { font-size:26px;}
	#Visual h1, .products #Visual em { letter-spacing: 0.12em;}
	.single .wp-article ul.icons { margin: 20px auto 30px;}
	article .wp-article h2 { margin-bottom: 30px;}
	.single .wp-article h2 { margin-bottom: 0;}
	.products .brands { margin-top: 40px;}
	.black #Visual { margin-bottom: 50px;}
	.products h3.h-eng { font-size: 26px;}
	.single article h3 { margin: 30px 0 0 0; padding: 30px 0 0 0;}
	
	header { margin-bottom: 60px;}
	header h1 img { margin-top: 40px;}
	form input { font-size: 18px;}
	hr { margin: 40px 0;}
	table { width: 100%;}
	table th,
	table td { padding: 8px 10px; width: auto;}
	#Contact table th, #Contact table td { display: block; width: 100%;  border: none;}
	table th { margin-top: 5px; padding-top: 12px; font-weight: bold; text-align: center; border-top: 1px solid #999;}
	.wp-article table th { min-width: inherit;}

	.list li,
	article .btn-box li { width: 100%;}
	.bn-lightbox { margin-bottom: 50px;}
	
	.list li { margin-bottom: 0; padding-top: 25px; border-bottom: 1px solid #333;}
	.list li a { max-width: none;}
	.list li figure { float: left; margin-right: 25px; width: 40%;}
	.list li h3 { font-size: 15px;}
	.list-image li,
	.list-photo li { width: 50%;}

	#Pickup .list li:last-child { border: none;}
	#Single main { width: 100% !important; margin: 0; padding: 0;}
	#Single article { margin: 0; padding: 0; }
	#Single .wp-article { padding: 10px 15px;}
	.wp-article iframe{ width:100%; max-width:100%; max-height: 450px; }
	.wp-article .alignleft { clear: all; float: none;}
	.single .box-w iframe { margin: 20px 0;}
	.single .wp-article img { margin: 20px 0;}

	fieldset { margin: 20px 0;}
	fieldset p { margin: 0;}

	/* page */
	#Visual .slider { height: 540px;}
	#Home article h2 { margin-bottom: 30px;}
	#Home #NewArrivals { padding-bottom: 80px;}

	#Contact h3 { text-align: left;}
	#Contact th, #Contact td { margin: 5px 0; padding: 0; text-align: left;}
	#Contact th { margin-top: 12px;}
	#Contact .submit { margin: 20px 0 0 0;}
	#Contact .clbr { display: none;}
	#Contact th span, fieldset legend span { top: 3px; right: 0;}
	#Contact fieldset legend span { top: -3px; right: -50px;}
	#FAQ .wp-article h3 { margin: 30px 0 20px; font-size: 20px;}
	#FAQ .box-w li { margin-bottom: 30px; padding-bottom: 30px;}
	#Download ul { margin: 0; }
	
}

@media screen and (max-width:420px) {
	iframe { width: 90%;}

	#AboutProducts p.illust img { height: 40px;}
	#AboutProducts p.illust img:nth-of-type(5),
	#AboutProducts p.illust img:nth-of-type(6) { height: 36px;}

	/* page */
	#Home #Visual h1,
	#Home #Visual h2,
	#Home #Visual .sd-4 h3 { padding-left: 30px; padding-right: 30px; font-size: 20px; line-height: 150%;}

}

@media screen and (max-width:340px) {
	.list li figure { width: 30%;}
	.list li figure img { height: 80px;}
	#Point li { clear: both; float: none; width: 100%;}

}

/*-------------------------------------
			CSS end
-------------------------------------*/
