@charset "utf-8";
@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,500,700,900);
@import url(https://fonts.googleapis.com/css?family=Orbitron:400,500,700,900);
@import url(https://fonts.googleapis.com/css?family=Unica+One);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(reset.css);

/* ---------------------------------------------------------------- *
    共通設定
 * ---------------------------------------------------------------- */

/* リンク色の設定 */
a:link {color:#3b3731;text-decoration:underline;}
a:visited {color:#3b3731;text-decoration:underline;}
a:hover {color:#8d867b;text-decoration:none;}
a:active {color:#8d867b;text-decoration:none;}

/* 明朝 */
.serif {font-family:"Roboto Slab",Garamond,"Times New Roman","游明朝","Yu Mincho","游明朝体","YuMincho","ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","HiraMinProN-W3","HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif;}

/* フォントファミリー設定 */
.ff1 {font-family:'Orbitron',sans-serif;}
.ff2 {font-family:'Roboto',sans-serif;}
.ff3 {font-family:'Unica One',cursive;}

/* フォントカラー・サイズ設定 */
.red {color:#e11648;}
.small {font-size:10px;}

/* 共通wrap */
.wrap {width:978px;margin:0 auto;}
.wrap2nd {width:978px;margin:0 auto;padding:60px 0;overflow:hidden;}

body {
	font-family:"Noto Sans Japanese","Roboto","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",sans-serif;
	color:#3b3731;
	background-color:#2e2b28;
}

header {width:100%;background-color:#FFF;overflow:hidden;}
header h1 a {text-indent:-9999px;display:block;width:160px;height:50px;margin:20px;background:url(../image/logo.png) no-repeat;background-size:160px 50px;float:left;}
header .mainMenu {width:550px;margin:37px 20px 0 0;float:right;}
header .mainMenu li a {display:block;font-size:15px;font-weight:700;text-decoration:none;margin-left:50px;float:left;}
header .spmenu {display:none;}

#pagetop {display:none;position:fixed;bottom:35px;right:35px;}
#pagetop li {list-style:none;font-family:'Roboto',sans-serif;font-weight:400;font-size:10px;line-height:125px;text-align:center;}
#pagetop a {z-index:1000;color:#6b655f;display:block;width:50px;height:50px;text-decoration:none;background:url("../image/pagetop.png") no-repeat;
opacity:1;transition:all .2s ease-in-out;}
#pagetop a:hover {opacity:0.9;transition:all .2s ease-in-out;}

footer {clear:both;width:100%;background-color:#2e2b28;overflow:hidden;}
footer p {margin:40px;font-size:10px;color:#FFF;text-align:center;}

.mainWrap {width:978px;margin:0 auto;padding:60px 0;overflow:hidden;}

/* ---------------------------------------------------------------- *
    HOME (PC)
 * ---------------------------------------------------------------- */

.topMainBtn {clear:both;background-color:#000;}
.topMainBtn ul {display:flex;height:84vh;}
.topMainBtn li {flex:1;transition:flex 1000ms ease-out;opacity:0.4; position:relative;}
.topMainBtn li:hover {flex:3;opacity:1;transition:500ms;}
.topMainBtn .text {width:350px;position:absolute;top:45%;right:50%;margin-right:-175px;text-shadow:0 1px 3px rgba(0,0,0,0.7);}
.topMainBtn h2 {text-align:center;font-size:25px;font-weight:500;color:#FFF;margin-bottom:30px;}
.topMainBtn a {display:block;width:100px;margin:0 auto;border:#FFF solid 5px;padding:20px;text-align:center;font-size:16px;font-weight:500;text-decoration:none;color:#FFF;background-color:rgba(46,43,40,0.2);transition:all .2s ease-in-out;}
.topMainBtn a:hover {background-color:rgba(0,0,0,0.6);transition:all .2s ease-in-out; color:#CCC;}
.topMainBtn .p1 {background:url(../image/topMainimg1.jpg) center no-repeat;background-size:cover;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.topMainBtn .p2 {background:url(../image/topMainimg2.jpg) center no-repeat;background-size:cover;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.topMainBtn .p3 {background:url(../image/topMainimg3.jpg) center no-repeat;background-size:cover;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}

/* ---------------------------------------------------------------- *
    2nd common (PC)
 * ---------------------------------------------------------------- */

.mainTitle {width:100%;height:400px;}
.mainTitle h2 {color:#FFF;font-size:42px;margin-left:60px;font-weight:700;line-height:400px;text-shadow:0 1px 5px rgba(0,0,0,0.8);}

.mainTitle2 {width:100%;height:200px;}
.mainTitle2 h2 {color:#FFF;font-size:42px;margin-left:60px;font-weight:700;line-height:200px;text-shadow:0 1px 5px rgba(0,0,0,0.8);}

/* ---------------------------------------------------------------- *
    products (PC)
 * ---------------------------------------------------------------- */

.mainTitle_products {background:url(../../products/image/titleimg.jpg) no-repeat right #2e2b28;background-size:auto 400px;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.mainTitle_products1 {background:url(../../products/image/garage/titleimg.jpg) no-repeat right #2e2b28;background-size:auto 400px;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.mainTitle_products2 {background:url(../../products/image/moto/titleimg.jpg) no-repeat right #2e2b28;background-size:auto 400px;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.mainTitle_products3 {background:url(../../products/image/wall/titleimg.jpg) no-repeat right #2e2b28;background-size:auto 400px;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}

.products .topbtn a {position:relative;display:block;width:974px;height:200px;border:#2e2b28 solid 2px; text-decoration:none;color:#3b3731;background:url(../../products/image/enterBg.png) no-repeat bottom right #f6f6f6;transition:all .1s ease-in-out;margin-bottom:10px;}
.products .topbtn a:hover {opacity:0.7;transition:all .1s ease-in-out;}
.products .topbtn a figure img {display:block;width:260px;margin:13px 30px 13px 13px;height:auto;float:left;}
.products .topbtn a h3 {font-weight:700;font-size:30px;line-height:200px;}
.products .topbtn a .enter {color:#FFF;font-size:12px;position:absolute; right:12px; bottom:12px;}

.products .item h3 {font-size:34px;font-weight:700;}
.products .textArea {width:540px;float:left;}
.products .textArea h4 {font-size:22px;letter-spacing:3px; font-weight:300;border-bottom:#333 dotted 1px; padding-bottom:15px;margin:50px 0 20px 0;}
.products .textArea p {margin:0 0 10px 0;line-height:200%;}
.products .textArea .price span {font-size:30px;padding-right:5px;}
.products .textArea .note {font-size:10px; line-height:140%;}
.products .photoArea {width:380px;float:right;}
.products .photoArea .mainImg img {display:block;width:376px;height:auto;}
.products .photoArea .subImg img {display:block;width:124px;height:auto;margin:2px 2px 0 0;float:left;}

/* ---------------------------------------------------------------- *
    company (PC)
 * ---------------------------------------------------------------- */

.mainTitle_company {background:url(../../company/image/titleimg.jpg) no-repeat right #2e2b28;background-size:auto 400px;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
#profile {background:url(../../company/image/bg1.jpg) repeat-x top #f7f6f4; border-bottom:#d2cfcc solid 1px;}
#profile h3 {font-weight:700;font-size:30px;margin-bottom:50px;}
#profile h3 span {font-size:23px;letter-spacing:6px;padding-left:10px;}
#profile .text1 { clear:both;line-height:200%;border-bottom:#2e2b28 dotted 1px; margin-bottom:10px;}
#profile .text1 span {display:inline-block; font-size:14px; font-weight:600;text-align:center;width:100px;background-color:#2e2b28;padding:3px;color:#FFF;margin:0 10px 10px 0;}

#contact {background:url(../../company/image/bg2.jpg) repeat-x top #f9f8f6;}
#contact h3 {font-weight:700;font-size:30px;margin-bottom:50px;}
#contact h3 span {font-size:23px;letter-spacing:3px;padding-left:10px;}
#contact .formp:first-child {margin:50px 0 8px 0;}
#contact .formp {margin:30px 0 8px 0;font-size:13px;}
#contact .formdiv input,#contact textarea {width:97%;border:solid 1px #CCC;padding:10px;border-radius:5px;}
#contact .submit {margin:40px 0 40px 0;}
#contact .submit .submitBtn {width:300px;padding:15px;font-size:25px;letter-spacing:5px;color:#FFF;background-color:#46423e;border-style:none;}
#contact .note {font-size:12px;margin-bottom:40px;}

#contact .phptext {text-align:center;}
#contact .phptext p {font-size:20px;line-height:200%;}

/* privacy policy */
.privacy h2 {font-size:30px;margin-bottom:30px;}
.privacy h3 {font-size:20px;margin-bottom:15px;}
.privacy p {font-size:14px;margin-bottom:30px;line-height:180%;}

/* ---------------------------------------------------------------- *
    画面の横幅が980px以下の場合に適用されるCSS（タブレット&スマホ）
 * ---------------------------------------------------------------- */

@media screen and (max-width:900px){

header {width:100%;background-color:#FFF;overflow:hidden;}
header h1 a {text-indent:-9999px;display:block;width:160px;height:50px;margin:30px auto;background:url(../image/logo.png) no-repeat;background-size:160px 50px;float:none;}

header .spmenu {display:block;width:100%;height:60px;background-color:#2e2b28;color:#FFF;text-align:center;font-weight:500;line-height:60px;font-size:16px;cursor:pointer;border-top:#CCC solid 1px;}
header .mainMenu {display:none;width:100%;margin:0;float:none;}
header .mainMenu {width:100%;}
header .mainMenu li a {display:block;background-color:#f7f7f7;width:100%;height:60px;line-height:60px;color:#3b3731;float:none;font-size:14px;margin:0; text-align:center;border-bottom:solid 1px #CCC;text-decoration:none;}

.nav-toggle {width:60px;height:60px;display:block;position: absolute;right:0px;top:2px;z-index:1001;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.nav-toggle div {width:30px;position:relative;right:-15px;top:20px;}
.nav-toggle span {display: block;position:absolute;height:2px;width:100%;background:#fff;left:0;zoom:1;transition: .35s ease-in-out;}
.nav-toggle span:nth-child(1) {top:0;}
.nav-toggle span:nth-child(2) {top:8px;}
.nav-toggle span:nth-child(3) {top:16px;}
.open .nav-toggle {background:transparent;}
.open .nav-toggle span {background: #fff;}
.open .nav-toggle span:nth-child(1) {top:9px;transform:rotate(-135deg);zoom:1;}
.open .nav-toggle span:nth-child(2) {width:0;left:50%;}
.open .nav-toggle span:nth-child(3) {top:9px;transform:rotate(135deg);zoom:1;}

#pagetop {display:block;position:static;}
#pagetop li {font-size:12px;line-height:50px;text-align:center;}
#pagetop a {color:#FFF;width:100%;height:50px;text-decoration:none;background:no-repeat url("../image/pagetop.png") #2e2b28; border-bottom:#625e59 solid 1px;}

.mainWrap {width:90%;margin:0 auto;padding:30px 0;overflow:hidden;}

/* ---------------------------------------------------------------- *
    HOME (SP)
 * ---------------------------------------------------------------- */

.topMainBtn {}
.topMainBtn ul {display:block;height:900px;}
.topMainBtn li { height:300px;flex:none;transition:none;opacity:1;position:inherit;}
.topMainBtn li:hover {flex:none;opacity:1;transition:500ms;}
.topMainBtn .text {width:300px;padding-top:80px;margin:0 auto;position:inherit;top:inherit;right:inherit;text-shadow:0 1px 5px rgba(0,0,0,1);}
.topMainBtn h2 {text-align:center;font-size:25px;font-weight:500;color:#FFF;margin-bottom:30px;}
.topMainBtn a {display:block;width:100px;margin:0 auto;border:#FFF solid 5px;padding:20px;text-align:center;font-size:16px;font-weight:500;text-decoration:none;color:#FFF;background-color:rgba(46,43,40,0.2);transition:all .2s ease-in-out;}
.topMainBtn a:hover {background-color:rgba(0,0,0,0.6);transition:all .2s ease-in-out; color:#CCC;}
.topMainBtn .p1 {background:url(../image/topMainimg1.jpg) center no-repeat;background-size:cover;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.topMainBtn .p2 {background:url(../image/topMainimg2.jpg) center no-repeat;background-size:cover;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}
.topMainBtn .p3 {background:url(../image/topMainimg3.jpg) center no-repeat;background-size:cover;box-shadow:0 1px 5px rgba(0,0,0,0.3) inset;}

/* ---------------------------------------------------------------- *
    2nd common (SP)
 * ---------------------------------------------------------------- */

.mainTitle {height:250px;overflow:hidden;}
.mainTitle h2 {font-size:24px;margin:110px 0 0 20px;line-height:100%;text-shadow:0 1px 3px rgba(0,0,0,0.8);}

.mainTitle2 {height:150px;overflow:hidden;}
.mainTitle2 h2 {font-size:24px;margin:65px 0 0 20px;line-height:100%;text-shadow:0 1px 3px rgba(0,0,0,0.8);}

/* ---------------------------------------------------------------- *
    products (SP)
 * ---------------------------------------------------------------- */

.mainTitle_products {background-size:auto 250px;}
.mainTitle_products1 {background-size:auto 250px;}
.mainTitle_products2 {background-size:auto 250px;}
.mainTitle_products3 {background-size:auto 250px;}

.products .topbtn a {position:inherit;display:block;width:98.5%;height:inherit;border:#2e2b28 solid 2px; text-decoration:none;color:#3b3731;background:#f6f6f6;transition:all .1s ease-in-out;margin-bottom:20px;}
.products .topbtn a:hover {opacity:0.7;transition:all .1s ease-in-out;}
.products .topbtn a figure img {display:block;width:90%;margin:15px auto;height:auto;float:none;}
.products .topbtn a h3 {font-size:22px;line-height:100%; text-align:center;}
.products .topbtn a .enter {width:90%;margin:15px auto;padding:10px 0; text-align:center;background:#2e2b28;color:#FFF;font-size:12px;position:inherit;right:inherit;bottom:inherit;}

.products .item h3 {font-size:22px;}
.products .textArea {width:100%;}
.products .textArea h4 {font-size:20px;padding-bottom:15px;margin:40px 0 20px 0;}
.products .textArea p { font-size:14px;margin:0 0 10px 0;line-height:200%;}
.products .textArea .price span {font-size:25px;}
.products .photoArea {width:300px; margin:0 auto;float:none;}
.products .photoArea .mainImg img {display:block;width:298px;height:auto;padding-top:30px;}
.products .photoArea .subImg img {display:block;width:98px;height:auto;margin:2px 2px 0 0;float:left;}

/* ---------------------------------------------------------------- *
    company (PC)
 * ---------------------------------------------------------------- */

.mainTitle_company {background-size:auto 200px;}
#profile h3 {font-size:25px;margin-bottom:30px;}
#profile h3 span {display:block;font-size:18px;letter-spacing:3px;padding-left:0;margin-top:15px;}
#profile .text1 span {font-size:13px;width:80px;}

#contact h3 {font-size:25px;margin-bottom:30px;}
#contact h3 span {display:block;font-size:18px;letter-spacing:3px;padding-left:0;margin-top:15px;}
#contact .caption { font-size:14px;line-height:160%;}
#contact .formp:first-child {margin:30px 0 8px 0;}
#contact .formp {margin:20px 0 8px 0;}
#contact .formdiv input,#contact textarea {width:90%;}
#contact .submit {margin:20px 0;}
#contact .submit .submitBtn {width:100%;}
#contact .note {font-size:12px;margin-bottom:20px;}

#contact .phptext {text-align:center;}
#contact .phptext p {font-size:20px;line-height:200%;}

/* privacy policy */
.privacy h2 {font-size:20px;margin-bottom:20px; font-weight:700;}
.privacy h3 {font-size:18px;margin-bottom:10px;}
.privacy p {font-size:14px;margin-bottom:30px;line-height:160%;}
.privacy p br {display:none;}

}