html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;}
body{line-height:1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
nav ul{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0;line-height:1.8}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
img{border:0; vertical-align:top; margin:0;}
a img {border: none;}
a:link {color: #325; text-decoration: underline;}
a:visited {color: #525; text-decoration: underline;}
a:hover, a:active, a:focus {color: #36e; text-decoration: none;}
ul, ol, dl {padding: 0; margin: 0; list-style-type: none;}

body {
	color: #222;
	background-color: #efefef;
	font-family: 'Helvetica Neue', 'Oswald', "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
	font-size: 16px;
	font-weight: 400;
	margin: 0;
	padding: 0;
	line-height: 1.8;
}

canvas.p5Canvas {
	position: absolute;
	top: 0;
	left: 0;
}

#toppage {
	background-color: #111;
}
#wrap {
	/* 管理ツールでカラー変更 */
}
#container {
	background-color: transprent;
	padding: 60px 0 0;
	position: relative;
}
#header {
	background-color: #eee;
	display: block;
	position: fixed;
	top: 0;
	border-bottom: 1px solid #ddd;
	width: 100%;
	height: 60px;
	z-index: 9999;
}
#header-inner {
	position: relative;
}
#sitetitle {
	background-color: #cfc;
	position: absolute;
	top: 0.6rem;
	left: 1rem;
	width: 147px;
	height: 35px;
}
#sitetitle span {
	text-indent: -9999px;
	display: block;
}
#headlogo {
	background-color: #cff;
	display: none;
}
#sitemenu {
	display: none;
	position: absolute;
	top: 0.25rem;
	right: 9rem;
}
#pagemenu {
	display: inline-block;
	position: absolute;
	top: 0.25rem;
	right: 5rem;
}
#lang {
	display: inline-block;
	position: absolute;
	top: 0.25rem;
	right: 1rem;
}
#mainnav {
	width: 714px;
	position: absolute;
	top: 0;
	left: 180px;
	text-align: center;
}
#toc {
	position: fixed;
	background-color: rgba(250, 250, 250, 0.5);
	text-align: right;
	border: 1px solid #ddd;
	margin: 0;
	padding: 1rem 1rem 1rem 2rem;
	top: 240px;
	right: 0;
	z-index: 10000;
}
#topimage {
	/* background: #888 url(../images/bg-pattern.png) 0 0; */
	background: #222;
}
#main-primg-area {
	background-color: transparent;
	position: relative;
	width: 100%;
	margin: 0;
	/* max-width: 920px;
	margin: 0 auto; */
}
#sub-primg-area {
	background-color: #222;
	padding: 2rem 3rem 0;
}
#contents {
	background-color: #fafafa;
	position: relative;
	box-sizing: border-box;
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
}
#contents-inner,
#contents-inner2 {
	background-color: transparent;
	display: flex;
	flex-wrap: wrap;
	margin-right: auto;
	margin-left: auto;
	box-sizing: border-box;
}
#toppage-3cols,
#toppage-3cols2 {
	background-color: transparent;
	flex: 0 0 100%;
	max-width: 100%;
	position: relative;
	width: 100%;
	min-height:1px;
	padding-right: 15px;
	padding-left: 15px;
	box-sizing: border-box;
}
#toppage-news {
	background-color: transparent;
	max-width: 800px;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 2.5rem;
}
#toppage-topics {
	max-width: 800px;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 2.5rem;
}
#toppage-utility {
	/* background-color: #def;
	max-width: 800px; */
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 2rem;
	margin-right: auto;
	margin-left: auto;
}
#toppage-utility1,
#toppage-utility2 {
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 2rem;
	margin-right: auto;
	margin-left: auto;
}
#accessimg-area {
	padding: 2rem 3rem 0;
}
#toppage-search {
	background-color: transparent;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 2.5rem;
}
#keywordsearch {
	background-color: transparent;
	margin: 1rem 0;
	padding: 0.5rem 0;
}
#keywordsearch-submit {
	
}
#needid {
	background-color: transparent;
}
#needsearch-submit {
	
}
#toppage-contact {
	background-color: transparent;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 2.5rem;
}
#toppage-usersite-login {
	background-color: transparent;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 3.5rem;
}
#site-banner {
	background-color: transparent;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 2.5rem;
}
#toppage-product {
	background-color: transparent;
	margin-top: -60px;
	padding-top: 60px;
	padding-bottom: 2.5rem;
}
#dynamics {
	background-color: #fafafa;
	float: none;
	clear: both;
	width: 100%;
}
#dynamics-inner {
	background-color: #fafafa;
	padding: 0;
}
#ranking {
	background-color: transparent;
	padding: 1rem 2rem;
}
#information {
	display: none;
}
#information-inner {

}
#ssl-info {

}
#cema-info {

}
#contact-info {

}
#skype-info {
	
}
#youtube-info {

}
#floatwindow {
	background-color: #eee;
	/* z-index: 20; */
	padding: 1rem 2rem;
	border-top:1px solid #ccc;
}
#floatwindow > div {
	padding: 0.5rem 1rem;
	border-left: 1px solid #ddd;
}
#floatwindow > div:first-child {
	border-left: none;
}
#floatwindow > div dt {
	font-size: 0.9rem;
}
#floatwindow > div dd {
	font-size: 0.82rem;
}
#floatwin-ssl  a {

}
#comodoTL {

}
#floatwin-cema {

}
#floatwin-contact {

}
#floatwin-skype {
	display: none;
}
#floatwin-youtube {

}
#footer {
	background-color: #222;
	box-sizing: border-box;
	width: 100%;
	padding: 1.5rem 2rem 1rem;
	border-top: 1px solid #ddd;
}
#footer-inner {
	background-color: #222;
	max-width: 1600px;
	margin-right: auto;
	margin-left: auto;
	font-size: 0.93rem;
	line-height: 1.75;
}
#sitenav {
	background-color: #222;
}
#sitenav-inner {
	font-size: 0.75rem;
}
#sitenav-inner > div {
	padding: 1rem;
	border-left: 1px solid #444;
}
#sitenav-inner >  div:first-child {
	border-left: none;
}
#sitenav h3 {
	font-size: 0.85rem;
	font-weight: bold;
	margin-top: 1rem;
}
#sitenav h3,
#sitenav ul li {
	color: #911;
}
#sitenav ul ul li {
	padding-left: 1rem;
}
#sitenav-inner a:hover {
	color: #eee;
}
#sitenav-inner img {
	padding:  2px 0 0 5px;
}

#copyright {
	color: #999;
	font-size: 0.7rem;
	text-align: center;
	padding-top: 2.5rem;
	padding-bottom: 0.5rem;
}

/* ------------------------------------------------- */

a {
	color: #424242;
	text-decoration: none;
}

h2.top-menu {
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.5;
	margin: 0 0 3rem;
	padding: 4rem 0 1rem;
	border-bottom: 1px solid #bebebe;
	text-align: center;
	box-sizing: border-box;
}
h2.top-menu + ul {
	list-style-type: none;
}
h2.top-menu a:link,
h2.top-menu a:hover,
h2.top-menu a:active,
h2.top-menu a:focus,
h2.top-menu a:visited {
	color: #555 !important;
	text-decoration: none !important;
}
h3 {
	margin-top: 2.5rem;
}

/* TOP UTILITY */

#toppage-search,
#toppage-contact,
#toppage-usersite-login,
#toppage-usersite-login + div {
	text-align: center;
}
#toppage-usersite-login label {
	padding: 0 0.5rem;
}

.pagetop {
	display: block;
	position: fixed;
	bottom: 30px;
	right: 20px;
	width: 64px;
	height: 64px;
	z-index: 1000;
}

div.toppage a.close {
	display: none;
	pointer-events: none;
}
div.toppage a:link,
div.toppage a:visited {
	color: #911;
	text-decoration:none;
}
div.toppage a:hover,
div.toppage a:active,
div.toppage a:focus {
	color: #c00;
	text-decoration:underline;
}

/* LANGUAGE MENU */
#lang .dropdown-item.active {
	text-decoration: none;
	background-color: #f8f9fa;
}
#lang a.dropdown-item:hover,
#lang a.dropdown-item:active,
#lang a.dropdown-item:focus {
	background-color: #f8f9fa;
}

/* MAIN NAV : グローバルナビゲーション */
html[lang='en']  #mainnav {
	font-family: 'Oswald', sans-serif;
	font-weight: 200;
}
ul.mainnav-list {
	margin-top: 1px;
}
ul.mainnav-list li {
	float: left;
	font-size: 0.85rem;
	width: 119px;
	height: 59px;
	line-height: 59px;
	border-left: 1px solid #ddd;
	position: relative;
}
ul.mainnav-list li:last-child {
	border-right: 1px solid #ddd;
}
ul.mainnav-list li a {
	display: block;
	width: 100%;
	height: 100%;
	position: relative;
}
ul.mainnav-list li.m-home {
	display: none;
}
ul.mainnav-list li a:hover {
	color: #777;
	text-decoration: none;
	border-bottom: 3px solid #de2726
}
ul.mainnav-l2 {
	display: none;
}
ul.mainnav-list li ul.mainnav-l2 li {
	float: none;
	font-size: 0.7rem;
	background: rgba(255,255,255,0.9);
	width: 150px;
	height: 39px;
	line-height: 39px;
	border-left: none;
	border-right: none;
	border-bottom: 1px solid #aaa;
}
ul.mainnav-list li ul.mainnav-l2 li ul {
	position: absolute;
	left: 149px;
	top: 0;
}

@media screen and (max-width: 1024px) {
	ul.mainnav-list {
		display: none;
	}
	#sitemenu {
		display: block;
	}
}

/* ニュースカテゴリー色設定 */
.cate-product, .cate-event, .cate-randd, .cate-others { background-image: none; padding-left: 0; width: 100%; }
.cate-product h2, .cate-product h3 { padding-bottom: 6px !important; border-bottom: 3px solid #c7633d; }
.cate-event h2, .cate-event h3 { padding-bottom: 6px !important; border-bottom: 3px solid #e4ba34; }
.cate-randd h2, .cate-randd h3 { padding-bottom: 6px !important; border-bottom: 3px solid #baa27d; }
.cate-others h2, .cate-others h3 { padding-bottom: 6px !important; border-bottom: 3px solid #cd7e9e; }
.cate-topics h2, .cate-topics h3 { padding-bottom: 6px !important; border-bottom: 3px solid #b66ec5; }
.entrypage-date { display: inline-block; padding-left: 5px; margin: 0; }
.entrypage-category a:link, .entrypage-category a:visited { text-decoration: none; color: #ddd; }
.entrypage-category a:active, .entrypage-category a:hover { text-decoration: none; color: #fff; }
.entrypage-category { display: inline-block; padding: 1px 4px 0; margin: 0; }
.entrypage-category.category-product { background-color: #c7633d; }
.entrypage-category.category-event { background-color: #e4ba34; }
.entrypage-category.category-randd { background-color: #baa27d; }
.entrypage-category.category-others { background-color: #cd7e9e; }
.entrypage-category.category-topics { background-color: #b66ec5; }
.side-nav ul li.present.product { background: #ccc url(../images/side-present-product.png) 0 center no-repeat; }
.side-nav ul li.present.event { background: #ccc url(../images/side-present-event.png) 0 center no-repeat; }
.side-nav ul li.present.randd { background: #ccc url(../images/side-present-randd.png) 0 center no-repeat; }
.side-nav ul li.present.others { background: #ccc url(../images/side-present-others.png) 0 center no-repeat; }
.side-nav ul li.present.topics { background: #ccc url(../images/side-present-topics.png) 0 center no-repeat; }
/* 製品のご案内 */
#product-top-menu { width: 700px; margin: 0 auto; }
#product-top-menu ul.tab li { width: 100px; height: 100px; float: left; position:relative; }
#product-top-menu ul.tab li a { display: block; }
#product-top-menu ul.tab li a.new-content::after { content:url(/images/new.png); position:absolute; right:10px; top:10px; }
#product-top-menu ul.tab li h3 { text-align: center; padding-top: 90px; }
#product-top-menu ul.panel { clear: both; }
#product-top-menu ul.panel li { padding: 10px; }
#product-top-menu ul.panel h2 { color: #555; font-size: 22px; font-weight: bold; letter-spacing: 10px; text-shadow: 1px 1px 1px #fff; text-align: center; /*background: url(/images/product_leader.png) 0 0 no-repeat; */ padding-top: 25px; }
#product-top-menu ul.panel p { color: #555; font-size: 12px; }
#product-top-menu ul.panel h3 { color: #325; font-size: 16px; font-weight: bold; text-align: center; background: url(/images/lineup-bgimg.png) no-repeat 0 0; /* border-bottom: 1px solid #999; */ }
#product-top-menu ul.panel h4 { color: #555; font-size: 14px; font-weight: bold; text-align: left; border-bottom: 1px solid #999; clear: left; }
.lineup-group ul.lineup-list li { float:left; width: 143px; height: 100px; margin-right: 7px; }
.lineup-group ul.lineup-list li img { border: 1px solid #999; margin-right: 23px; } /* 製品のご案内 ラインナップのサムネイルサイズの調整用 */
.lineup-group ul.lineup-list li a.new-content p::after { content:url(/images/new.png); position:relative; left:2px; top:2px; }
#product-top-menu p.lineup-product-title { font-size: 10px !important; line-height: 20px; width: 143px; height: 20px; overflow: hidden; }
#product-top-menu a:link, #product-top-menu a:visited { text-decoration: none; }
#product-top-menu a:active, #product-top-menu a:hover { text-decoration: underline; }
.panel h2 { line-height: 85px; }
/* Modal Area */
.modal-dialog {
	max-width: 4000px;
	margin: 0;
	margin-right: -15px;
	width: 100vw;
	height: 100vh;
}
.modal-content {
	background-color: transparent;
	width: 600px;
	border-radius: 0;
	margin: 4rem auto 0;
}
.modal-content ul li,
.modal-content ul li a {
	color: #fff;
}

/* MAIN PR IMAGE AREA */
#main-primg-area .box_skitter_large,
#main-primg-area .box_skitter {
	margin: 0 auto;
}

/* SUB PR IMAGE AREA */
#sub-primg-area .slick-slide img {
	width: 100%;
	/* height: 286px; */
	border: 1px solid #fff;
	overflow: hidden;
}
#sub-primg-area .sub-primg-title {
	display: block;
	color: #fff;
	font-size: 0.75rem;
	text-align: center;
	padding: 0.3rem 0;
	width: 100%;
}
li.slick-slide {
	background-color: transparent;
}

/* NEWS */
.newsdate {
	font-family: 'Oswald', 'Helvetica', 'Helvetica Neue', 'Arial', sans-serif;
	font-weight: 200;
	text-align: center;
	letter-spacing: 0.1rem;
	padding-top: 0.45rem;
}
h3.newstitle {
	font-size: 1.25rem;
	margin-top: 1rem;
	padding: 0.5rem 1rem;
	text-align: center;
}
h4.newssubtitle {
	color: #333;
	font-size: 0.9rem;
	font-weight: 600;
	padding: 0.75rem 0;
	text-align: center;
}
p.continue-link {
	font-size: 0.8rem;
	padding: 0.5rem 0 2rem;
	text-align: center;
}

/* SEARCH */
#toppage-search .top-menu-lead {
	margin-bottom: 1rem;
}
#keywordsearch {
	background-color:white;
	border:1px solid #bbb;
	width: 90%;
}
.need-select {
	position: relative;
	border: 1px solid #bbbbbb;
	border-radius: 2px;
	background: #ffffff;
	margin: 1rem 0;
}
.need-select select {
	width: 100%;
	padding-right: 1em;
	cursor: pointer;
	text-indent: 0.01px;
	text-overflow: ellipsis;
	border: none;
	outline: none;
	background: transparent;
	background-image: none;
	box-shadow: none;
	-webkit-appearance: none;
	appearance: none;
	padding: 8px 38px 8px 8px;
	color: #666666;
}
.need-select select::-ms-expand {
    display: none;
}
.need-select::before {
	position: absolute;
	top: 0.8em;
	right: 0.9em;
	width: 0;
	height: 0;
	padding: 0;
	content: '';
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 6px solid #666666;
	pointer-events: none;
}

/* CONTACT */
#toppage-contact p {
	text-align: center;
}
#toppage-contact button {
	margin: 1rem 0;
}

/* USER SITE LOGIN */
#toppage-usersite-login .form-horizontal {
	width: 100%;
}
#toppage-usersite-login .form-inline {
	margin: 0 auto;
	padding: 1rem 2rem;
	/* 左右中央寄せ */
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	 justify-content: center;
	/* 上下中央寄せ */
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

/* SITE BANNER */
#site-banner figure {
	background-color: rgba(20, 20, 20, 0.75);
	box-sizing: border-box;
	width: 100%;
	height: 10rem;
	border: 1px solid #fff;
	padding: 0;
	overflow: hidden;
	/* display: table-cell; */
	vertical-align: middle;
	/* flexible box */
	/* display: -webkit-flex;
	display: flex; */
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center;
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center;
	text-align: center;
	position: relative;
}
#site-banner figure.top-banner:after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	top: 0;
}
#site-banner figure.swan:after {
	opacity: .3;
	background: url(../images/banner-swan-img.png) no-repeat center center;
	background-size: cover;
	transition: all .2s ease-out;
}
#site-banner figure.linedancer:after {
	opacity: .2;
	background: url(../images/banner-linedancer-img.png) no-repeat center center;
	background-size: cover;
	transition: all .2s ease-out;
}
#site-banner figure.tv:after {
	opacity: .3;
	background: url(../images/banner-takubotv-img.png) no-repeat center center;
	background-size: cover;
	transition: all .2s ease-out;
}
#site-banner figure.ebook:after {
	opacity: .3;
	background: url(../images/banner-takubomanager-img.png) no-repeat center center;
	background-size: cover;
	transition: all .2s ease-out;
}
#site-banner figure.drytec:after {
	opacity: .3;
	background: url(../images/banner-DRY-TEC-img.png) no-repeat center center;
	background-size: cover;
	transition: all .2s ease-out;
}
#site-banner figure.oilbooth:after {
	opacity: .3;
	background: url(../images/banner-OILBOOTH-img.png) no-repeat center center;
	background-size: cover;
	transition: all .2s ease-out;
}
#site-banner figure a {
	color: #fff;
	display: block;
	width: 100%;
	height: 100%;
	/* display: -webkit-flex;
	display: flex; */
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center;
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
	justify-content: center;
	z-index: 10;
}
#site-banner figure.top-banner:hover:after {
	opacity: .9;
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
	background-color: rgba(20, 20, 20, 0.1);
}
#site-banner figcaption {
	display: block;
	color: #fff;
	background-color: rgba(128,0,0,0.5);
	font-size: 0.75rem;
	text-align: center;
	position: absolute;
	bottom: 0;
	width: 100%;
	z-index: 20;
}

/* ACCESS RANKING */
#ranking .rankingtitle {
	text-align: center;
}
#ranking .rankingtext {
	font-size: 0.8rem;
	padding: 0.5rem 1rem;
}
#ranking .continue-link {
	font-size: 0.8rem;
	text-align: center;
}
.slick-prev:before, .slick-next:before {
	color: #777;
}
#ranking img {
	box-sizing: border-box;
	border: 1px solid #fff;
}

/* OTHER CUSTOMIZATION */
.btn-secondary {
	margin: 0.5rem;
}

.btn-secondary,
a.btn-secondary {
	color: #555 !important;
	background-color: transparent;
	border-color: #888;
}
.btn-secondary:hover,
a:hover.btn-secondary {
	color: #fff !important;
	text-decoration: none !important;
}

#bg-p501,
#bg-p502 {
	position: relative;
	margin: 0;
	padding: 0;
	display: block;
}

#bg-p502 {
	display: none;
}

.inline {
	display: inline-block;
}

/* INQUIRY BANNER */
.banner{
  position: relative;
  margin: 0;
  display: none;
}
.banner .banner_img{
  position: fixed;
  right: 5px;
  bottom: 115px;
  z-index: 88;
}
.banner_img_inner{
  width: 155px,
  height: 240px;
  box-sizing:border-box;
  padding: 0;
  background-color: transparent;
}
.banner .banner_img_inner a{
  display: block;
}
.banner .banner_img p.close{
  position: absolute;
  right: 10px;
  top:10px;
}
.banner .banner_img p.close a{
  display: block;
  width: 25px;
  height: 25px;
  text-align: center;
  background-color: transparent;
}
.banner .banner_img p.close a span{
  display: block;
  width: 1px;
  height: 1px;
  overflow: hidden;
}