@charset "utf-8";
/* common.css */

body {animation: fadeIn 1s ease 0s 1 normal;}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

/*--=== SP ONLY max-width: 767px ===-- / */
@media screen and (max-width: 767px){
html{background-color: #262626;}
body{font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-feature-settings:"pkna" 1;letter-spacing: 0.02em}

strong{font-weight: bold;}
a{text-decoration: none}
sup{vertical-align: super}
sub{vertical-align:sub;font-size: 75.5%;}

img{max-width: 100%;
height: auto;
width /***/:auto;　}


#main_ctn{background-position: center bottom;margin: 0 auto;background-color:#fff; }

header{background-image:url(/images/header_bg.jpg) ;height:60px;background-size: cover;position:relative;}
#authorized_reseller{font-size: 8px;}
#shop_name{padding:7px 0 0 10px;}
#shop_name a{display: block;background-image:url(/images/h-d_logo.png);background-repeat: no-repeat;padding-left: 50px;background-size:44px 34px;background-position:0 5px;position:relative;color:#343434}
#shop_name_english{font-family:'Oswald';font-size:18px;position:relative;margin-top:3px}
header h1{font-size:12px;position:relative;font-weight: bold;}

#goodwood_logo{display: none}

#sns_list{display:none;}




/*#gnav_button / */
#gnav_button_ctn{position: absolute;top: 0px;right: 0px;}

#gnav_button {
    display: block;
    width: 42px;
    height:42px;
    position: relative;

    z-index: 3;
    background: #f86217;

}

#gnav_button span {
    display: block;
    background: #fff;
    width: 24px;
    height: 2px;
    position: absolute;
    left: 9px;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
}
#gnav_button span:first-child {
    top: 12px;
}
#gnav_button span:nth-child(2) {
    margin-top: -1px;
    top: 50%;
}
#gnav_button span:last-child {
    bottom: 12px;
}
#gnav_button.active span:first-child {
    -webkit-transform: translateY(8px) rotate(45deg);
    -moz-transform: translateY(8px) rotate(45deg);
    -ms-transform: translateY(8px) rotate(45deg);
    transform: translateY(8px) rotate(45deg);
}
#gnav_button.active span:nth-child(2) {
    opacity: 0;
}
#gnav_button.active span:last-child {
    -webkit-transform: translateY(-8px) rotate(-45deg);
    -moz-transform: translateY(-8px) rotate(-45deg);
    -ms-transform: translateY(-8px) rotate(-45deg);
    transform: translateY(-8px) rotate(-45deg);
}
/* / #gnav_button */



#gnav{display: none}
#gnav{z-index: 5000;position:absolute;top:60px;z-index: 3000;background-color: #f86217;width:100%}

#gnav > ul{width: 100%}

#gnav > ul > li{}
#gnav > ul > li > a{font-weight: bold;font-size: 14px;color: #fff;text-decoration: none;display: block;padding:10px 10px;color: #fff;border-bottom: 1px solid #fff;}
#gnav span{font-family:'Oswald';font-weight: 400;font-size:16px;margin-right: 5px; }

#gnav li.staff_blog a:after{display: inline-block;font-family: 'FontAwesome';content:  "\f14c";margin-left: 1em;font-weight: normal}


body#home #gnav > ul > li.home > a{border-left: 8px solid #fff}

#home #gnav li.home a{border-left: 8px solid #fff}
#info #gnav li.info a{border-left: 8px solid #fff}
#premium #gnav li.premium a{border-left: 8px solid #fff}
#custom #gnav li.custom a{border-left: 8px solid #fff}
#touring #gnav li.touring a{border-left: 8px solid #fff}#staff #gnav li.staff a{border-left: 8px solid #fff}
#shop_info #gnav li.shop_info a{border-left: 8px solid #fff}


#contents h2{border-top: 1px solid #ea571e;border-bottom: 1px solid #ea571e;color:#ea571e;padding: 0.5% 0% 0.5% 2.5%;margin-top: 30px;position:relative;font-size: 18px;margin-bottom: 8px;;}
#contents h2:after{display: block;float:right;background-color:#ea571e;width:7.5%;height:100%;content:"　";font-size: 18px;}

#contents span{}

#goodwood_info{background-color: #262626;padding: 40px 0;color:#aaa}
#goodwood_info h2{text-align:center;margin-bottom: 15px}
#goodwood_info h2 img{width:80%}
#goodwood_info h3{text-align:center;border:1px solid #aaa;font-size: 14px;padding: 10px;width:95%;margin:0 auto}

#goodwood_info ul{margin-top: 15px;}
#goodwood_info ul li{text-align:center;line-height:1.6em;padding: 10px;border-bottom: 1px dotted #666;}

#goodwood_info ul li h4{font-size: 14px;font-weight: bold}
#goodwood_info ul li a{color:#fff;text-decoration: underline}

#page_top{text-align:right;}
#page_top a{background-color:#ea571e;;color:#fff;display: inline-block;padding: 10px 20px;font-size:12px;}
#page_top a:before{display: inline-block;font-family: 'FontAwesome';content:  "\f0aa";font-weight: normal;margin-right: 0.5em}
#main_footer{background-color: #000;padding: 40px 2.5%;color:#aaa;text-align:center;font-size: 12px;line-height:1.6em;}
#main_footer a{text-decoration: underline;color:#aaa;}

#main_footer ul{margin-bottom: 1em}
#main_footer ul li:after{content: "|";margin:0 10px;}
#main_footer ul li:first-child:before{content: "|";margin:0 10px;}


/* common class / */

.sp_none{display:none!important}
/* / common class */ 






}
/*--=== / SP ONLY max-width: 767px ===-- */


/*--=== PC ONLY min-width: 768px ===-- / */



@media print, screen and (min-width: 768px){


html{background-color: #262626;}
body{font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; letter-spacing: 0.02em;line-height:1.8em;-ms-font-feature-settings: "normal"}
img{width: 100%;height: auto}
strong{font-weight: bold;}
a{text-decoration: none}
sup{vertical-align: super}
sub{vertical-align:bottom;font-size: 75.5%;}
	
#main_ctn{max-width:1280px;background-position: center bottom;margin: 0 auto;background-color:#fff; }

header{background-image:url(/images/header_bg.jpg) ;height:9em;background-size: cover;position:relative;min-height: 110px;}
#authorized_reseller{padding-top:0px}
#shop_name{padding:14px 0 0 30px;height: 8em}
#shop_name a{display: block;background-image:url(/images/h-d_logo.png);background-repeat: no-repeat;padding-left: 130px;height: 98px;position:relative;color:#343434}
#shop_name_english{font-family:'Oswald';font-size:262%;position:relative;margin-top:8px}
header h1{font-size:116%;position:relative;font-weight: bold;margin-top:8px}

#goodwood_logo{position:absolute;right:20px;top:10px;width:16.17%}

#sns_list{display: inline-block;font-family: 'FontAwesome';font-size:197% ;position:absolute;bottom:10px;right:20px;color: #4e4e4e}
#sns_list li{display: inline-block}
#sns_list li span{display: none}
#sns_list li.twitter{}
#sns_list li.twitter:before{content:  "\f081"}
#sns_list li.facebook:before{content:  "\f082"}

#gnav_button{display: none}
#gnav{background-color: #e1541e;text-align:center;margin-top:-4px;z-index: 100;position:relative;}
#gnav li{display: inline-block;line-height:1.8em;}
#gnav li a{display: block;white-space: nowrap;text-align:center;color:#fff;padding:15px 1.1vw;margin:-2px 0.35vw;font-size: 1.2vw;border-top:8px transparent solid;transition: all 300ms 0s ease;}
#gnav li a:hover{border-top:8px #ae3a00 solid}
#gnav span{font-family:'Oswald';font-weight: 400;font-size:1.8vw }
#gnav span:after{content: "\a";white-space: pre ;}
#home #gnav li.home a{border-top:8px #ae3a00 solid}
#info #gnav li.info a{border-top:8px #ae3a00 solid}
#premium #gnav li.premium a{border-top:8px #ae3a00 solid}
#custom #gnav li.custom a{border-top:8px #ae3a00 solid}
#touring #gnav li.touring a{border-top:8px #ae3a00 solid}
#staff #gnav li.staff a{border-top:8px #ae3a00 solid}
#shop_info #gnav li.shop_info a{border-top:8px #ae3a00 solid}




#contents h2{border-left: 9px solid #ea571e;border-bottom: 1px solid #ea571e;color:#ea571e;padding: 0.5% 1.5%;margin-bottom: 1.5vw;}
#contents span{}

#goodwood_info{background-color: #262626;padding: 40px 0;color:#aaa}
#goodwood_info h2{text-align:center;margin-bottom: 15px}
#goodwood_info h2 img{width:28.28%}
#goodwood_info h3{text-align:center;border:1px solid #aaa;font-size: 123.1%;padding: 10px;width:95%;margin:0 auto}

#goodwood_info ul{margin-top: 15px;}
#goodwood_info ul:after{content: "."; display: block; height: 0; font-size:0;clear: both; visibility:hidden;}
#goodwood_info ul li{float: left;width:32%;margin-left: 2%;text-align:center;line-height:1.6em;}
#goodwood_info ul li:first-child{margin-left: 0}
#goodwood_info ul li h4{font-size: 123.1%;font-weight: bold}

#page_top{text-align:center;}
#page_top a{background-color:#ea571e;;color:#fff;display: block;padding: 10px 20px;font-size:123.1%;}
#page_top a:before{display: inline-block;font-family: 'FontAwesome';content:  "\f0aa";font-weight: normal;margin-right: 0.5em}
#main_footer{background-color: #000;padding: 40px 2.5%;color:#aaa;text-align:center;font-size: 108%;line-height:1.6em;}
#main_footer a{text-decoration: underline;color:#aaa;}

#main_footer ul{margin-bottom: 1em}
#main_footer ul li:after{content: "|";margin:0 10px;}
#main_footer ul li:first-child:before{content: "|";margin:0 10px;}

/* common class / */ 
.pc_none{display:none!important}
/* / common class */ 

}
/*--=== / PC ONLY min-width: 768px ===-- */

@media print, screen and (min-width: 1280px){
#gnav li a{padding:15px 20px;margin:-2px 5px;font-size:108%}
#gnav span{font-family:'Oswald';font-weight: 400;font-size: 153.9%;}
#main_image{width:1280px;height:500px;}
}


/* / common class */ 
/*-----------------------------------------------------
Yahoo UI Library Font-size Adjustment
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
http://developer.yahoo.com/yui/license.txt
http://developer.yahoo.com/yui/fonts/
 
10px = 77%     11px = 85%     12px = 93%     13px = 100%
14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%
22px = 167%    23px = 174%    24px = 182%    25px = 189%
26px = 197%
------------------------------------------------------*/




