/*! normalize.css v2.1.3 | MIT License | git.io/normalize */

/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */

/**
 * Correct `block` display not defined in IE 8/9.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */

audio,
canvas,
video {
    display: inline-block;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
    display: none;
    height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9.
 * Hide the `template` element in IE, Safari, and Firefox < 22.
 */

[hidden],
template {
    display: none;
}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
    font-size: 62.5%;
    font-family: sans-serif; /* 1 */
    -ms-text-size-adjust: 100%; /* 2 */
    -webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
    margin: 0;
    background-color:#000000;
    color:#FFFFFF;
    font-size:12px; font-size:1.2rem;
}

/* ==========================================================================
   Links
   ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
    background: transparent;
    color:#00d92a;
}

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */

a:focus {
    outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */

a:active,
a:hover {
    outline: 0;
}

/* ==========================================================================
   Typography
   ========================================================================== */

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */

h1 {
    font-size: 2em;
    margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9, Safari 5, and Chrome.
 */

abbr[title] {
    border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */

b,
strong {
    font-weight: bold;
}

/**
 * Address styling not present in Safari 5 and Chrome.
 */

dfn {
    font-style: italic;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
    background: #ff0;
    color: #000;
}

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */

code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */

pre {
    white-space: pre-wrap;
}

/**
 * Set consistent quote types.
 */

q {
    quotes: "\201C" "\201D" "\2018" "\2019";
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sup {
    top: -0.5em;
}

sub {
    bottom: -0.25em;
}

/* ==========================================================================
   Embedded content
   ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9.
 */

img {
    border: 0;
    
    width:100%;
    height:auto;
}

/**
 * Correct overflow displayed oddly in IE 9.
 */

svg:not(:root) {
    overflow: hidden;
}

/* ==========================================================================
   Figures
   ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari 5.
 */

figure {
    margin: 0;
}

/* ==========================================================================
   Forms
   ========================================================================== */

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
    border: 0; /* 1 */
    padding: 0; /* 2 */
}

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */

button,
input,
select,
textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 2 */
    margin: 0; /* 3 */
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

button,
input {
    line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */

button,
select {
    text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button; /* 2 */
    cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
    cursor: default;
}

/**
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */

input[type="search"] {
    -webkit-appearance: textfield; /* 1 */
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box; /* 2 */
    box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
    overflow: auto; /* 1 */
    vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */
table{
    width:90%;
    margin:0 5% 5%;
    line-height:1.4;
    font-size:12px; font-size:1.2rem;
    border-collapse:collapse;
    border-spacing:0;
    empty-cells:show;
    border-top:1px solid #636262;
    border-left:1px solid #636262;
}
table th{
    padding:2% 4%;
    border-bottom:1px solid #636262;
    background-color:#222222;
    text-align:right;
    font-weight:normal;
    vertical-align:top;
}
table td{
    padding:2% 4%;
    border-right:1px solid #636262;
    border-bottom:1px solid #636262;
}

/**/
dl{
    width:90%;
    margin:0 5% 5%;
    line-height:1.4;
    font-size:12px; font-size:1.2rem;
    background-color:#222222;
    border-bottom:1px solid #636262;
    border-left:1px solid #636262;
    border-right:1px solid #636262;
}
    dl dt{
        padding:2% 4%;
        font-weight:bold;
        border-top:1px solid #636262;
    }
    dl dd{
        margin:0 0 0 4%;
        padding:2% 4%;
        
        background-color:#000000;
    }

/* Helper classes
========================================================================== */
.clearfix:before,
.clearfix:after{
    content: " ";
    display: table;
}

.clearfix:after{
    clear: both;
}

.clearfix{
    *zoom: 1;
}

/**/
ul{
    margin:0;
    padding:0;
    list-style:none;
}
/**/
ul.link_list{
    margin:5% 0 2%;
    padding:0;
    list-style:none;
    border-top:1px solid #636262;
}
ul.link_list li{
    margin:0;
    padding:0 ;
    border-bottom:1px solid #636262;
}
ul.link_list li a{
    display:block;
    margin:0;
    padding:4% 13.2% 4% 5%;
    color:#FFFFFF;
    text-decoration:none;
    background:url(../images/link_arrow.png) no-repeat 95% center;
    background-size:3.906% auto;
}
/**/
p.page-lead{
    margin:0 0 5%;
    padding:0 5%;
    line-height:1.6;
}
p.page-img{
    width:100%;
    margin:0 0 5%;
    padding:0;
}

/* #wrap
========================================================================== */
#wrap{
    width:100%;
}

.boreder-wrap{
    margin:0 0 5%;
    padding:0 5%;
    border-top:1px solid #636262;
}
.content-wrap{
    margin:0 0 5%;
    padding:0 5%;
}
.nm{
    margin-top:-5%;
}

.boreder-wrap p,
.content-wrap p{
    margin:0 0 5%;
    padding:0;
    line-height:1.6;
}

/* Header
========================================================================== */
.page-header{
    position:relative;
    z-index:300;
}
.page-header h1{
    width:40.9%;
    margin:0 0 0 2%;
    padding:2.5% 0 2.5%;
    float:left;
}
#nav-open{
    width:9.06%;
    margin:0 2% 0 0;
    padding:5% 0 0 0;
    overflow:hidden;
    float:right;
}
#nav-open a.close{
    display:block;
    text-indent: 100%;
    white-space: nowrap;
    
    background:url(../images/header_arrow_up.png) no-repeat left top;
    background-size:100% auto;
}


#page-nav{
    width:100%;
    background-color:#000000;
    clear:both;
    position:absolute;
    left:0;
}

#page-nav ul{
    border-top:1px solid #636262;
}
#page-nav ul li{
    display:inline-block;
    width:50%;
    border-bottom:1px solid #636262;
    font-size:12px; font-size:1.4rem;
    float:left;
}
#page-nav ul li:nth-child(even) a{
    border-left:1px solid #636262;
}
#page-nav ul li a{
    display:block;
    margin:0;
    padding:8% 0 8% 5%;
    color:#FFFFFF;
    text-decoration:none;
    background:url(../images/nav_link_arrow.png) no-repeat left center;
    background-size:3.125% auto;
}

#page-nav ul li#page-nav-en{
    clear:both;
    width:100%;
}
#page-nav ul li#page-nav-en a{
    padding:4% 13.2% 4% 0;
    text-align:right;
    background:url(../images/link_arrow.png) no-repeat 95% center;
    background-size:3.906% auto;
}

/* Footer
========================================================================== */
.page-footer{
    text-align:center;
    z-index:200;
}
p.top_back{
    width:100%;
    margin:0 0 10px;
    padding:0;
}
p.top_back a{
    display:block;
    width:90%;
    margin:0 auto;
    padding:2% 0;
    background-color: #636262;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
p.top_back a img{
    width:4.17%;
}

p#copyright{
    margin:0;
    padding:0 0 10px;
}
p#copyright small{
    font-size:10px; font-size:1.0rem;
}

/* Contents
========================================================================== */
#contents{
    width:100%;
    margin:0 0 20px;
    padding:0;
    position:relative;
    z-index:100;
}

/* top */
.top-sec{
    margin:0;
    padding:0 0 3%;
}
.top-sec p{
    margin:0 0 2%;
    padding:0 5%;
    line-height:1.6;
}
.top-sec p span{
    font-size:10px; font-size:1.0rem;
}

.top-sec-header{
    margin:0 0 5%;
    padding:0;
    position:relative;
}
.top-sec-header h2{
    width:90%;
    margin:0;
    padding:1% 5% 2%;
    line-height:1.4;
    background-color:rgba(0,0,0,0.60);
    font-size:18px; font-size:1.8rem;
    font-weight:bold;
    position:absolute;
    left:0;
    bottom:0;
}
.top-sec-header h2 span{
    color:#00ff29;
    font-size:10px; font-size:1.0rem;
    font-weight:normal;
}
.top-sec-header h2 span.small{
    margin:0 0 0 1%;
    color:#FFFFFF;
    font-size:10px; font-size:1.0rem;
    font-weight:bold;
}

/* section */
.section-sec{
    margin:0;
    padding:31.25% 5% 3%;
    position:relative;
}
.section-sec figure{
    width:100%;
    margin:0;
    padding:0;
    position:absolute;
    left:0;
    top:0;
}
.section-sec h3{
    margin:2px 0 5%;
    padding:1% 0 1% 2%;
    line-height:1.4;
    border-left:1px solid #00d82a;
    font-size:14px; font-size:1.4rem;
    font-weight:bold;
}
.section-sec h3 span{
    color:#00d92a;
    font-size:12px; font-size:1.2rem;
    font-weight:normal;
}
.section-sec h4{
    margin:0 0 2%;
    padding:2% 0 0;
    color:#00d92a;
    font-size:12px; font-size:1.2rem;
    font-weight:bold;
}
.section-sec p{
    margin:0 0 2%;
    padding:0;
    line-height:1.6;
}
.section-sec ul{
    margin:0 0 2% 1em;
    padding:0;
    list-style:disc;
    line-height:1.6;
}

/* gallery */
ul#gallery-top{
}
ul#gallery-top li{
    margin:0;
    padding:31.25% 0 0;
    background-position:left top;
    background-repeat:no-repeat;
    background-size:100% auto;
    position:relative;
}
ul#gallery-top li a{
    display:block;
    width:95%;
    margin:0;
    padding:3% 0 3% 5%;
    color:#FFFFFF;
    font-size:14px; font-size:1.4rem;
    text-decoration:none;
    background-color:rgba(0,0,0,0.5);
    background-image:url(../images/link_arrow_s.png);
    background-position:95% center;
    background-repeat:no-repeat;
    background-size:2.81% auto;
    position:absolute;
    left:0;
    bottom:0;
}
#gallery1-top{ background-image:url(../images/gallery1_top.jpg); }
#gallery2-top{ background-image:url(../images/gallery2_top.jpg); }
#gallery3-top{ background-image:url(../images/gallery3_top.jpg); }
#gallery4-top{ background-image:url(../images/gallery4_top.jpg); }
#gallery5-top{ background-image:url(../images/gallery5_top.jpg); }
#gallery6-top{ background-image:url(../images/gallery6_top.jpg); }
#gallery7-top{ background-image:url(../images/gallery7_top.jpg); }
#gallery8-top{ background-image:url(../images/gallery8_top.jpg); }
#gallery9-top{ background-image:url(../images/gallery9_top.jpg); }
/**/
.gallery-imgs{
    margin:0;
    padding:0 0 2%;
    line-height:1.4;
    background:url(../images/gallery_bg.jpg) no-repeat left bottom;
    background-size:100% auto;
    font-size:12px; font-size:1.2rem;
    color:#cccccc;
}
.gallery-imgs-boder{
    padding-top:5%;
    background:url(../images/page_ttl_border.gif) no-repeat left top;
    background-size:100% auto;
}
.gallery-imgs-l,.gallery-imgs-r{
    margin-bottom:5%;
}
.gallery-imgs-l figure{
    width:38.75%;
    margin:0 0 0 5%;
    float:left;
}
.gallery-imgs-l p{
    margin:0 0 0 43.75%;
    padding:3% 0 3% 3%;
    border-bottom:1px solid #636262;
    text-shadow: 2px 3px 5px rgba(0,0,0,.75);
}

.gallery-imgs-r figure{
    width:38.75%;
    margin:0 5% 0 0;
    float:right;
}
.gallery-imgs-r p{
    margin:0 43.75% 0 0;
    padding:3% 3% 3% 0;
    border-bottom:1px solid #636262;
    text-align:right;
    text-shadow: 2px 3px 5px rgba(0,0,0,.75);
}

.gallery-imgs-l p.s{
    padding:2% 0 2% 3%;
}
.gallery-imgs-r p.s{
    padding:2% 3% 2% 0;
}
 
p.gallery-txt{
    margin:0 5% 0 0;
    color:#FFFFFF;
    text-align:right;
    text-shadow: 2px 3px 5px rgba(0,0,0,.75);
}
p.gallery-txt span{
    margin:0;
    padding:0 0 0 78px;
    color:#CCCCCC;
    background:url(../images/gallery_border.gif) no-repeat left center;
}
.gallery-imgs-r p.gallery-txt{
    margin:0 0 0 5%;
    padding:5% 0 0;
    text-align:left;
    border:none;
}
/**/
.gallery-main{
    margin:0 0 2%;
    padding:105% 5% 0;
    background-position:left top;
    background-repeat:no-repeat;
    background-size:100% auto;
    position:relative;
}
.gallery-main h2{
    margin:0;
    padding:0;
    font-size:24px; font-size:2.4rem;
    font-weight:normal;
    text-shadow: 2px 3px 5px rgba(0,0,0,.8);
    position:absolute;
    top:5%;
    left:5%;
}
.gallery-main p{
    margin:0;
    padding:0;
    line-height:2.1;
    font-size:14px; font-size:1.4rem;
    text-shadow: 1px 2px 3px rgba(0,0,0,.8);
    position:absolute;
    top:24%;
    left:5%;
}
.gallery-main p.s{
    top:18%;
}

#gallery1{ background-image:url(../images/gallery1_bg.jpg); }
#gallery2{ background-image:url(../images/gallery2_bg.jpg); }
#gallery3{ background-image:url(../images/gallery3_bg.jpg); }
#gallery4{ background-image:url(../images/gallery4_bg.jpg); }
#gallery5{ background-image:url(../images/gallery5_bg.jpg); }
#gallery6{ background-image:url(../images/gallery6_bg.jpg); }
#gallery7{ background-image:url(../images/gallery7_bg.jpg); }
#gallery8{ background-image:url(../images/gallery8_bg.jpg); }
#gallery9{ background-image:url(../images/gallery9_bg.jpg); }

/**/
.gallery-nav{
    border-top:1px solid #636262;
    border-top:1px solid #636262;
}
.gallery-nav a{
    display:block;
    color:#FFFFFF;
    text-decoration:none;
}
.gallery-nav p.prev,.gallery-nav p.next{
    width:50%;
    margin:0 0 4%;
    padding:0;
    border-bottom:1px solid #636262;
}
.gallery-nav p.prev{
    float:left;
}
.gallery-nav p.prev a{
    padding:4% 5% 4% 13.2%;
    background:url(../images/link_arrow_r.png) no-repeat 5% center;
    background-size:3.906% auto;
}
.gallery-nav p.next{
    text-align:right;
    float:right;
}
.gallery-nav p.next a{
    padding:4% 13.2% 4% 5%;
    border-left:1px solid #636262;
    background:url(../images/link_arrow.png) no-repeat 95% center;
    background-size:3.906% auto;
}

.gallery-nav p.next.s a,
.gallery-nav p.prev.s a{ line-height:2.5em; }

.gallery-nav p.back{
    width:100%;
    margin:0;
    padding:0;
    font-size:16px; font-weight:1.6rem;
    font-weight:bold;
    text-align:center;
    clear:both;
}
.gallery-nav p.back a{
    display:block;
    width:75%;
    margin:0 auto;
    padding:2% 0;
    background-color: #999999;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

/* contact */
strong.attention{
    color:#ff6666;
    font-weight:normal;
}

div.attention{
    margin:0 5% 5%;
    padding:3% 3% 1% 3%;
    border:2px solid #e35b5b;
}
div.attention ul{
}
div.attention ul li{
    margin:0 0 2%;
    padding:3% 0 3% 9%;
    background:url(../images/attention.png) no-repeat left center;
    background-size:7.55% auto;
}

#contact-form h3{
    margin:0 5% 3%;
    padding:0;
    font-size:14px; font-size:1.4rem;
    font-weight:bold;
}
#contact-form h3 span{
    margin-left:5px;
    font-size:12px; font-size:1.2rem;
    font-weight:normal;
}
#contact-form p{
    margin:0 5% 4%;
    padding:0;
}
#contact-form input[type="text"],
#contact-form input[type="tel"],
#contact-form input[type="email"],
#contact-form textarea{
    width:96%;
    margin:0;
    padding:2% 1%;
    line-height:1.4;
    border:none;
    border-radius: 5px;
    box-shadow: inset 1px 2px 5px rgba(0,0,0,.3);
    background-color:#FFFFFF;
}
#contact-form select{
    width:96%;
    height:2.2em;
    border:none;
    background-color:#FFFFFF;
}
#contact-form input.error,
#contact-form textarea.error,
#contact-form select.error{
    background-color:#ff6666;
}

/**/
#contact-confirm table th{ width:28%; }

#contact-form p.btn,
#contact-confirm p.btn,
p.contact-btn{
    padding:2% 0 0;
    text-align:center;
}

#contact-form input#btnSubmit,
#contact-confirm input#btnSubmit,
#contact-confirm input#btnBack{
    width:80%;
    padding:2% 0;
    color:#FFFFFF;
    font-size:16px; font-size:1.6rem;
    font-weight:bold;
    border-radius:5px;
    background-color:#00d82a;
    border:none;
}

#contact-confirm input#btnBack{
    background-color:#999999;
}

p.contact-btn a{
    display:block;
    width:80%;
    margin:0 auto;
    padding:2% 0;
    color:#FFFFFF;
    font-size:16px; font-size:1.6rem;
    font-weight:bold;
    border-radius:5px;
    background-color:#999999;
    border:none;
    text-decoration:none;
}


/* ttl */
.page-ttl{
    margin:0 0 5%;
    padding:3% 5%;
    border-bottom:1px solid #636262;
    background:url(../images/page_ttl_border.gif) no-repeat left top;
    background-size:100% auto;
    font-size:18px; font-size:1.8rem;
    font-weight:bold;
}


.page-sttl{
    margin:0 0 5%;
    padding:2% 0 2% 2%;
    border-left:2px solid #00d82a;
    font-size:14px; font-size:1.4rem;
    font-weight:bold;
}