@charset "utf-8";
/* CSS Document */

* {
	box-sizing: border-box;
}

body {
	font-size: 14px;
	line-height: 1.6;
	color: #333333;
	-webkit-text-size-adjust: 100%;
	overflow-x:hidden;
}

#container {
	position:relative;
	padding:64px 0 0 0;
	width:100%;
}

#disable-layer {
	display:none;
	position:fixed;
	left:0;
	top:0;;
	z-index:997;
	background:rgba(240, 240, 240, .9);
	width:100%;
	height:100%;
}


/* ヘッダー部分 */

#hearder {
	position:fixed;
	top: 0;
	left:0;
	z-index:998;
	padding:0;
	border-bottom:3px solid #f0f0f0;
	background:#FFFFFF;
	display:block;
	width:100%;
	height:64px;		
}

#hearder .inner {
	position:relative;
	width:100%;/* 300/320=93.75% */
	padding:0;
	margin:0 auto;
}

#hearder .inner .logoArea {
	text-align:center;
}

#hearder .inner .logoArea h1 {
	display:inline-block;
	padding:0;
	margin:0;
	width:30%;
	max-width:75px;	
	line-height:64px;
}

#hearder .inner .logoArea h1 a {
	display:block;
	width:75px;
	height:0px;
	padding:60px 0 0 0;
	margin:0;
	overflow:hidden;
	background:url(../img/logo.png) no-repeat top center;
	background-size:cover;
}

#hearder .inner .pickLink {
	position:absolute;
	top:12px;
	right:3%;
	padding:0;
	margin:0;
}

#hearder .inner .pickLink ul {
	padding:0;
	margin:0;
	width:54px;
}

#hearder .inner .pickLink ul li {
	display:block;
	float:left;
	margin:0;
	padding:0 3px;
	width:48px;
	font-size:12px;
	
}

#hearder .inner .pickLink ul li:nth-of-type(1) span {
	display:block;
	padding:42px 0 0 0;
	margin:0;
	width:42px;
	height:0px;
	overflow:hidden;
	background:url(../img/catalog_mark.png) no-repeat top left;
	background-size:cover;
}

#hearder .inner .pickLink ul li:nth-of-type(2) span {
	display:block;
	padding:42px 0 0 0;
	margin:0;
	width:42px;
	height:0px;
	overflow:hidden;
	background:url(../img/mypage_mark.png) no-repeat top left;
	background-size:cover;
}

#hearder .language {
	display:block;
	position:absolute;
	top:12px;
	left:5%;
	z-index:999;
	margin-left:42px;
	width:42px;
	height:42px;
}

#hearder .language .country {
	display:block;
	margin:0;
	padding:0 3px;
	width:42px;
	font-size:12px;	
}

#hearder .language .country p {
	display:block;
}

#hearder .language .country p.title {
	display:none;
}

#hearder .language .country p.select {
	display:block;
	padding:42px 0 0 0;
	margin:0;
	width:42px;
	height:0px;
	overflow:hidden;
	background:url(../img/world_mark.png) no-repeat top left;
	background-size:cover;
	cursor:pointer;
}

#naviMark {
	position:absolute;
	top:12px;
	left:5%;
	z-index:999;
	width:42px;
	height:42px;
	background:#ffffff;
}

.menu-trigger {
	position: relative;
	display:block;
	float:left;
	width: 25px;
	height: 22px;
	padding:0 3px;
	margin:8px 14px 0 0;	
}
.menu-trigger span {
  display: inline-block;
  transition: all .4s;
  box-sizing: border-box;
}

.menu-trigger span {
  position: absolute;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #000000;
}
.menu-trigger span:nth-of-type(1) {
  top: 0;
}
.menu-trigger span:nth-of-type(2) {
  top: 10px;
}
.menu-trigger span:nth-of-type(3) {
  bottom: 0;
}

.menu-trigger.active span:nth-of-type(1) {
  -webkit-transform: translateY(10px) rotate(-45deg);
  transform: translateY(10px) rotate(-45deg);
}
.menu-trigger.active span:nth-of-type(2) {
  opacity: 0;
}
.menu-trigger.active span:nth-of-type(3) {
  -webkit-transform: translateY(-10px) rotate(45deg);
  transform: translateY(-10px) rotate(45deg);
}

#navi {
	position:fixed;
	top:0;
	left:-280px;
	z-index:999;
	padding:0;
    background: #FFFFFF;
	border-right:1px solid #a07f35;
	width: 280px;
	height: 100%;
}

#navi .infoBox {
	padding:0;
	margin:0;
	border-bottom:solid 1px #cccccc;
}

#navi .infoBox p {
	padding:0;
	margin:0;
}

#navi .infoBox p.mypage a {
	display:block;
	padding:0 0 0 36px;
	margin:0;
	background:url(../img/mypage2_mark.png) no-repeat 5% 50%;
	background-size:24px 24px;
	font-size:14px;
	font-weight:bold;
	line-height:4em;
}

#navi ul {
	padding:0;
	margin:0;
	border-top:solid 1px #fafafa ;
}

#navi ul li {
	padding:0;
	margin:0;
	border-bottom:solid 1px #fafafa ;
	display:block;
	box-sizing:border-box;
	text-align:left;
}

#navi ul li span {
	display:block;
	padding:0 0 0 5%;
	background:#dedede;
	color:#231815;
    font-size:14px;
    line-height:2em;
}

#navi ul li a {
	display:block;
	padding:0 0 0 42px;
	color:#231815;
    font-size:14px;
    line-height:2.5em;	
}

#navi > ul > li:first-child a {
	background:url(../img/catalog2_mark.png) no-repeat 5% 50%;
	background-size:24px 24px;
}

#navi > ul > li:nth-child(2) a {
	background:url(../img/business_mark.png) no-repeat 5% 50%;
	background-size:24px 24px;
}

#navi ul ul li a {
	display:block;
	padding:0 0 0 1em;
	background:url(../img/arrow_gray.png) no-repeat 92% 50%;
	background-size:10px 10px;
	color:#231815;
    font-size:14px;
    line-height:2.5em;	
}

#navi .selectCountry {
	padding:0;
	margin:0;
}

#navi .selectCountry > p {
	padding:0 0 0 5%;
	margin:0;
	background:#dedede;
	font-size:14px;
	font-family:Ubuntu;
	line-height:2em;
}

#navi .selectCountry .country p {
	padding:0 0 0 5%;
	margin:0;
	border-bottom:solid 1px #fafafa;
	background:url(../img/select_arrow_mark.png) no-repeat 92% 50%;
	background-size:14px 14px;
	color:#000000;
	font-size:12px;
	line-height:2.5em;	
}

.catalog {
	display:none;
	position:fixed;
	top: 0;
	left: 0;
	z-index:20;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.9);
}

.catalog.open {
	display:block;
}


.catalog dl {
	padding:64px 0 0 0;
	margin:0;
	background:#fafafa;
}

.catalog dl dt {
	padding:6px 0 6px 5%;
	margin:0;
	border-top:solid 1px #e0e0e0;
	border-bottom:solid 1px #e0e0e0;
}

.catalog dl dt.cre span {
	display:block;
	padding:26px 0 0 0;
	margin:0;
	width:64px;
	height:0px;
	overflow:hidden;
	background:url(../img/cre_logo.png) no-repeat top center;
	background-size:64px 18px;
}

.catalog dl dd {
	padding:0;
	margin:0;
	border-bottom:solid 1px #e0e0e0;
}

.catalog ul {
	padding:0;
	margin:0;
	box-shadow: 0px 6px 3px rgba(50,50,50,0.6);
  -webkit-box-shadow: 0px 6px 3px rgba(50,50,50,0.6);
  -moz-box-shadow: 0px 6px 3px rgba(50,50,50,0.6);
}

.catalog ul li {
	display:block;
	float:left;
	border-right:solid 1px #e0e0e0;
	box-sizing:border-box;
	width:33.3%;
}

.catalog ul li a {
	display:block;
	color:#a07f35;
	font-size:12px;
}

.catalog ul li:last-child {
	border-right:solid 1px #f6f5f3;
}

figcaption {
	padding:0 0 1em 0;
}

/* フッター部分 */

footer * a {
	text-decoration: none;
	color:#808080;
}

#hearder a:focus {
	outline: none;
}

footer {
	position:relative;
	background:#0f0f0f;
	color:#bdbebe;
}

footer .info {
	padding:12px 0;
	margin:0;
	background:#272727;
}

footer .info .inner {
	position:relative;
	padding:0;
	margin:0 auto;
	width:90%;
}

footer .info h2 {
	display:block;
	float:left;
	padding:0;
	margin:0;
	border-right:solid 1px #babbbb; 
	width:92px;    
}

footer .info h2 a {
	display:block;
	padding:64px 0 0 0;
	margin:0;
	width:75px;
	height:0px;
	overflow:hidden;
	background:url(../img/footer_logo.png) no-repeat top center;
	background-size:75px 60px;
}

footer .info .selectCountry {
	float:left;
	padding:0 0 0 14px;
	margin:0;
	width:45%;
}

footer .info .selectCountry > p {
	padding:0;
	margin:0 0 6px 0;
	font-size:14px;
	font-family:Ubuntu;
}

footer .info .selectCountry .country p {
	padding:.5em 1em;
	margin:0;
	background:#bcbcbc url(../img/select_arrow_mark.png) no-repeat 97% 50%;
	background-size:14px 14px;
	font-size:12px;
	color:#000000;
	cursor:pointer;
}

footer .info .returnTop {
	position:absolute;
	top:0px;
	right:0px;
	z-index:1;
	padding:0;
	margin:0;
	width:64px;
	height:64px;
}

footer .info .returnTop a {
	display:block;
	padding:64px 0 0 0;
	margin:0;
	width:64px;
	height:0px;
	overflow:hidden;
	background:url(../img/return_mark.png) no-repeat top center;
	background-size:cover;
	font-size:12px;
	color:#808080;
}

footer .linkBox {
	padding:36px 0 0 0;
	margin:0 auto;
	width:90%;
	font-size:13px;
}

footer .linkBox dl.linkList {
	padding:0;
	margin:0;
}

footer .linkBox dl.linkList p {
	padding:0 0 0 1em;
	margin:0;
}

footer .linkBox dl.linkList .icon {
	position:absolute;
	top:12px;
	right:0px;
	color:#FF0004;
}

footer .linkBox dl.linkList dt {
	position:relative;
	padding:.75em 0;
	margin:0;
	border-top:#272727 solid 1px;
}

footer .linkBox dl.linkList dd {
	display:none;
	padding:0;
	margin:0;
	background:#202020;
}

.icon,
.icon span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
.icon {
	position: relative;
	width: 24px;
	height: 24px;
	float: right;
	margin-right: 5px;
}
.icon span {
	position: absolute;
    left: 6px;
    width: 50%;
	height: 2px;
    background-color: #808080;
}

.icon span:nth-of-type(1) {
    top: 5px;
	transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
}
.icon span:nth-of-type(2) {
    top: 5px;
	transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
	-moz-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
}

.icon.active span:nth-of-type(1) {
	display:none;
}
.icon.active span:nth-of-type(2) {
	top: 5px;
	transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
	-ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}

footer .linkBox dl.linkList ul {
	padding:0;
	margin:0;
}

footer .linkBox dl.linkList ul li {
	padding:.75em 0;
	margin:0;
	border-top:#272727 solid 1px;
	color:#808080;
}

footer .linkBox dl.linkList ul li a {
	display:block;
	padding:0 0 0 2em;
	margin:0;
	background:url(../img/arrow_gray.png) no-repeat 95% 50%;
	background-size:10px 10px;
	color:#808080;
}

footer .socialLink{
	padding:12px 0;
	margin:0 auto;
	border-top:#272727 solid 1px;
	width:90%;
	text-align:center;
}

footer .socialLink ul{
	padding:0;
	margin:0 auto;
	width:144px;
}

footer .socialLink ul li {
	display:block;
	float:left;
	margin:0;
	padding:0 6px;
	width:48px;
	font-size:12px;	
}

footer .socialLink ul li:nth-of-type(1) span {
	display:block;
	padding:42px 0 0 0;
	margin:0;
	width:42px;
	height:0px;
	overflow:hidden;
	background:url(../img/twitter_mark.png) no-repeat top left;
	background-size:cover;
}

footer .socialLink ul li:nth-of-type(2) span {
	display:block;
	padding:42px 0 0 0;
	margin:0;
	width:42px;
	height:0px;
	overflow:hidden;
	background:url(../img/facebook_mark.png) no-repeat top left;
	background-size:cover;
}

footer .socialLink ul li:nth-of-type(3) span {
	display:block;
	padding:42px 0 0 0;
	margin:0;
	width:42px;
	height:0px;
	overflow:hidden;
	background:url(../img/youtube_mark.png) no-repeat top left;
	background-size:cover;
}

footer .siteLink {
	width:90%;
	padding:0;
	margin:0 auto;
	font-size:12px;
}

footer .siteLink ul {
	padding:0;
	margin:0 auto;
	border-bottom:solid 1px #272727;
}
footer .siteLink ul li {
	display:block;
	float:left;
	padding:.75em 0;
	margin:0;
	border-top:solid 1px #272727;
	width:50%;
	text-align:center;
}

footer .siteLink ul li:nth-child(odd) {
	border-right:solid 1px #272727;
}

footer .siteLink ul li a {
	display:block;
	padding:0;
	margin:0;
	color:#808080;
}

footer p.copyright {
	padding:1em 0;
	margin:0;
	text-align:center;
	font-size:10px;
	color:#808080;
}


/* 言語エリア */

.countryField {
  position: fixed;
  top: 0;
  left: 0;
  z-index:999;
  width: 100%;
  height: 100%;
  background:rgba(30, 30, 30, .9) url(../img/world_map.png) no-repeat 50% center;
  background-size:contain;
  opacity: 0;
  visibility: hidden;
  transition: .3s linear;
}

.countryField .inner {
	padding:48px 0;
	margin:0 auto;
	width:90%;
	font-size:12px;
}

.countryField .inner h5 {
	padding:0 0 12px 0;
	margin:0 0 36px 0;
	background:url(../img/title_mark.png) no-repeat bottom center;
	background-size:32px 12px;
	color:#a07f35;
	text-align:center;
	font-size:18px;
}

.countryField.open {
  opacity: 1;
  visibility: visible;
}

.countryField .close {
	text-align:center;
}

.countryField .close p {
	display:inline-block;
	padding:0 0 0 32px;
	margin:0;
	background:url(../img/close_mark.png) no-repeat top left;
	background-size:30px 30px;
	color:#a07f35;
	font-size:18px;
	font-weight:bold;
	text-decoration:underline;
	cursor:pointer;
}

.countryField .close p:hover {
	text-decoration:none;
}

.countryField ul {
	padding:0;
	margin:0 0 24px 0;
	border-top:solid 1px #a07f35;
}

.countryField ul li {
	border-bottom:solid 1px #a07f35;
	line-height:3em;
	font-size:16px;
	font-weight:bold;
	text-align:center;
}

.countryField ul li a {
	display:block;
	color:#a07f35;
}

#topicPath {
    width:100%;
	text-align:right;
	font-size:14px;
	padding:0;
	margin:0;
	border-bottom:1px solid #f0f0f0;
}

#topicPath ul {
	padding:4px 0 0 0;
	margin:0 auto;
	width:90%;
	text-align:left;
}

#topicPath ul li {
    color:#404040;
	display:block;
	float:left;
	padding:0;
	margin:0;
	line-height:2em;
    list-style-type: none;
}

#topicPath ul li span {
	display:block;
	padding:28px 0 0 0;
	margin:0;
	width:24px;
	height:0px;
	overflow:hidden;
	background:url(../img/home_mark.png) no-repeat 50% center;
	background-size:24px 24px
}

#topicPath ul li a {
    color: #a07f35;
    text-decoration:none;
	display:block;
	margin:0 8px 0 0;
    padding:0 16px 0 0;
    background:url(../img/arrow_gold.png) no-repeat right center;
	background-size:10px 10px;
}

/*----------------------------------------------------------------------------
 ***                                                                width480
----------------------------------------------------------------------------*/

@media only screen and (min-width: 480px){
}

/*----------------------------------------------------------------------------
 ***                                                                width768
----------------------------------------------------------------------------*/

@media only screen and (min-width: 768px){

#hearder .inner {
	padding:0;
	margin:0 auto;
	width:90%;/* 300/320=93.75% */
	max-width:1024px;
}

#hearder .inner .logoArea {
	text-align:left;
}

#naviMark {
	display:none;
}

#navi {
	display:none;
	position:static;
	padding:0;
	margin:0;
	box-sizing:border-box;
	width: 500px;
	height:auto;
    background:none;
	border-right:none;
}

#hearder .inner .pickLink {
	position:absolute;
	top:16px;
	right:0px;
	padding:0;
	margin:0;
}

#hearder .inner .pickLink ul {
	padding:0;
	margin:0;
	width:140px;
}

#hearder .inner .pickLink ul li {
	display:inline-block;
	float:none;
	margin:0;
	padding:0 20px 0 0;
	width:auto;
	font-size:14px;
}

#hearder .inner .pickLink ul li:nth-of-type(2) {
	padding:0;
}

#hearder .inner .pickLink ul li:nth-of-type(1) span {
	display:block;
	padding:0 0 0 36px;
	margin:0;
	width:auto;
	height:auto;
	overflow:auto;
	background:url(../img/catalog2_mark.png) no-repeat top left;
	background-size:30px 30px;
	line-height:30px;
	cursor:pointer;
}

#hearder .inner .pickLink ul li:nth-of-type(2) span {
	display:block;
	padding:0 0 0 36px;
	margin:0;
	width:auto;
	height:auto;
	overflow:auto;
	background:url(../img/mypage2_mark.png) no-repeat top left;
	background-size:30px 30px;
	line-height:30px;
}

#hearder .inner .pickLink ul li:nth-of-type(1) span:hover {
	text-decoration:underline;
}

#hearder .language {
	top:16px;
	left:96px;
	margin:0;
	width:276px;
	height:32px;
}

#hearder .language .country {
	padding:0 0 0 36px;
	margin:0;
	background:url(../img/world2_mark.png) no-repeat top left;
	background-size:34px 34px;
	width:auto;
	height:34px;
}

#hearder .language .country p {
	display:inline-block;
	padding:0;
	margin:0;
}

#hearder .language .country p.title {
	display:block;
	float:left;
	padding:4px 0 0 0;
	font-size:14px;
	font-family:Ubuntu;
}

#hearder .language .country p.title span {
	padding:0 4px;
}

#hearder .language .country p.select {
	display:block;
	float:left;
	padding:6px 12px 6px 6px;
	margin:0;
	background:url(../img/select_arrow_mark.png) no-repeat 95% 50%;
	background-size:14px 14px;
	width:7.5em;
	height:auto;
	color:#1a1a1a;
	font-size:14px;
	font-weight:bold;
	text-decoration:underline;
}

#hearder .language .country p.select:hover {
	text-decoration:none;
}

footer .info .inner {
	padding:0;
	margin:0 auto;
	width:90%;
	max-width:1024px;
}

footer .linkBox {
	padding:36px 0 0 0;
	margin:0 auto;
	width:90%;
	max-width:1024px;
}

footer .linkBox dl.linkList {
	padding:0;
	margin:0 auto 0 0;
	width:auto;
	max-width:1024px;
}

footer .linkBox dl.linkList dt {
	border-bottom:solid 1px #272727;
	background:none;
}

footer .linkBox dl.linkList dd {
	display:block;
	padding:0;
	margin:0;
	background:none;
}

footer .linkBox dl.linkList ul li {
	display:block;
	float:left;
	padding:.75em 0;
	margin:0;
	width:25%;
	border-top:none;
	color:#808080;
}

footer .socialLink{
	padding:12px 0;
	margin:0 auto;
	max-width:1024px;
}

footer .siteLink {
	padding:0;
	margin:0 auto;
	max-width:1024px;
}

footer .siteLink ul {
	padding:0 0 24px 0;
	text-align:center;
}

footer .siteLink ul li {
	display:inline-block;
	float:none;
	padding:0 1em;
	margin:0;
	border-top:none;
	border-right:solid 1px #272727;
	width:auto;
	text-align:center;
}

footer .siteLink ul li:nth-child(odd) {
	border-right:solid 1px #272727;
}

footer .siteLink ul li:last-child {
	border-right:none;
}

.countryField .inner {
	padding:72px;
	margin:100px auto 0 auto;
	background:#f5f5f5;
	width:90%;
	max-width:920px;
}

.countryField .inner h5 {
	padding:0 0 12px 0;
	margin:0 0 48px 0;
	font-size:24px;
}

#topicPath {
    width:100%;
	text-align:right;
	font-size:14px;
	padding:0;
	margin:0;
	background:#e6e8eb;
	border-bottom:none;
}


#topicPath ul {
	padding:4px 0 0 0;
	margin:0 auto;
	width:90%;
	max-width:1024px;
}

#topicPath ul li span {
	display:block;
	padding:0 0 0 28px;
	margin:0;
	width:74px;
	height:auto;
	overflow:visible;
	background:url(../img/home_mark.png) no-repeat left top;
	background-size:24px 24px
}




}



/*----------------------------------------------------------------------------
 ***                                                                width1024
----------------------------------------------------------------------------*/

@media only screen and (min-width: 1024px){


}

