@charset "utf-8";

/*
 *
 * Usage: Base layout
 *
 * Name: style.css
 *
 */

/* FONT size
---------------------------------------------------------------------
[ px ]	[ % ]
10px 	83  %		19px 	158 %
11px 	92  %		20px 	167 %
12px 	100 %		21px 	175 %
13px 	108 %		22px 	183 %
14px 	117 %		23px 	192 %
15px 	125 %		24px 	200 %
16px 	133 %		25px 	208 %
17px 	142 %		26px 	217 %
18px 	150 %
---------------------------------------------------------------------*/


/*---------------------------------------------------------------------
setting
---------------------------------------------------------------------*/
@font-face  {
    font-family:axisR;
    src:url(../font/axisstd-regular.otf);
}
@font-face  {
    font-family:axisM;
    src:url(../font/axisstd-medium.otf);
}
@font-face  {
    font-family:axisL;
    src:url(../font/axisstd-light.otf);
}
@font-face  {
    font-family:axisEL;
    src:url(../font/axisstd-extralight.otf);
}

html,body   {height:100%;}
body  {min-width:1100px; font-family:axisR !important;}

::selection {background:#cfcfcf;}
::-moz-selection {background:#cfcfcf;}


/*---------------------------------------------------------------------
CSS3 animation & parts layout
---------------------------------------------------------------------*/
/* link */
a img         {opacity:1; filter:alpha(opacity=100);  -webkit-transition:all 0.2s ease-in; -moz-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
a:hover img   {opacity:0.7; filter:alpha(opacity=70); -webkit-transition:all 0.2s ease-in; -moz-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
a             {-moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
a:hover       {-moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
.opa_bg a,
.opa_bg input        {opacity:1; -moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
.opa_bg a:hover,
.opa_bg input:hover  {opacity:0.7; -moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; transition:all 0.2s ease-in;}
.trans_bg a          {display:block; overflow:hidden; height:0; opacity:1; filter:alpha(opacity=100); -moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; transition: all 0.2s ease-in;}
.trans_bg a:hover    {opacity:0; filter:alpha(opacity=0); -moz-transition:all 0.2s ease-in; -webkit-transition:all 0.2s ease-in; transition: all 0.2s ease-in;}

.axisR   {font-family:axisR !important;}
.axisM   {font-family:axisM !important;}
.axisL   {font-family:axisL !important;}
.axisEL  {font-family:axisEL !important;}


/*---------------------------------------------------------------------
Common layout
---------------------------------------------------------------------*/
/* header */
#header     {background:#fff; height:90px; width:100%; box-shadow:0 1px 1px rgba(0,0,0,0.03); position:relative; z-index:999;}
#headInner  {width:1100px; margin:0 auto; position:relative;}
  #header h1  {position:absolute; top:14px; left:0;}
  #header #gnav  {margin-left:450px; text-align:center; height:90px;}
    #header #gnav li  {float:left; height:100%;}
    #header #gnav a   {display:block; overflow:hidden; height:0; padding-top:90px; background-position:50% 50%; background-repeat:no-repeat;}
    #header #gnav a:hover   {background-color:#f9f8f4;}
    #header #gnav a.active  {background-color:#f9f8f4;}
    
    #header #gnav .gnav01  {width:55px;}
    #header #gnav .gnav02  {width:87px;}
    #header #gnav .gnav03  {width:123px;}
    #header #gnav .gnav04  {width:109px;}
    #header #gnav .gnav05  {width:79px;}
    #header #gnav .gnav06  {width:104px;}
    
    #header #gnav .gnav01 a  {background-image:url(../images/common/gnav_01.png);}
    #header #gnav .gnav02 a  {background-image:url(../images/common/gnav_02.png);}
    #header #gnav .gnav03 a  {background-image:url(../images/common/gnav_03.png);}
    #header #gnav .gnav04 a  {background-image:url(../images/common/gnav_04.png);}
    #header #gnav .gnav05 a  {background-image:url(../images/common/gnav_05.png);}
    #header #gnav .gnav06 a  {background-image:url(../images/common/gnav_06.png);}

  #header #sns  {position:absolute; top:27px; right:0; width:80px;}
    #header #sns li  {float:left;}
    #header #sns a   {padding-top:36px; width:36px;}
    
    #header #sns #btnTw  {background:url(../images/common/btn_tw_on.gif) no-repeat 0 0; margin-right:8px;}
    #header #sns #btnFb  {background:url(../images/common/btn_fb_on.gif) no-repeat 0 0;}
    #header #sns #btnTw a  {background:url(../images/common/btn_tw.gif) no-repeat 0 0;}
    #header #sns #btnFb a  {background:url(../images/common/btn_fb.gif) no-repeat 0 0;}


/* footer */
#footer  {text-align:center; height:35px; position:relative; width:1100px; margin:0 auto;}
    #footer #copyright  {padding-top:13px; position:relative; z-index:99; font-size:8px; color:#c3c3c3; letter-spacing:0.2em; display:inline-block;}


/* scroll contents */
#container  {background:#fff; position:relative;}
#inner  {padding:30px 40px; width:1020px; margin:0 auto; position:relative; opacity:0;}
#scrollContents  {height:100%; overflow:auto;}
#scrollInner  {position:relative;}

#pageTitle  {font-size:32px; line-height:100%; text-align:center; margin-bottom:40px;}

#btnPagetop  {background:url(../images/common/btn_pagetop_on.gif) no-repeat 0 0; width:100px; position:absolute; bottom:-35px; right:0; z-index:10;}
#btnPagetop a  {background:url(../images/common/btn_pagetop.gif) no-repeat 0 0; padding-top:35px;}

.mCSB_scrollTools a + .mCSB_draggerContainer  {margin:30px 0;}
.mCSB_scrollTools  {width:20px; opacity:1;}
.mCSB_scrollTools .mCSB_draggerRail  {width:100%; border-radius:0; background-color:#f9f8f4 !important;}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar  {width:100%; border-radius:0; background-color:#d6d5d0 !important;}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar   {background-color:#d6d5d0 !important; opacity:0.9;}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar  {background-color:#d6d5d0 !important; opacity:0.7;}

.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown  {opacity:1; height:30px;}
.mCSB_scrollTools .mCSB_buttonUp    {background:url(../images/common/btn_up.png) no-repeat 0 0;}
.mCSB_scrollTools .mCSB_buttonDown  {background:url(../images/common/btn_down.png) no-repeat 0 100%;}