﻿/*-----------------------------------------------------	*/
/*	for all						*/
/*-----------------------------------------------------	*/

/*******************************************
Font-size Adjustment
77% = 10px	| 	129% = 17px	|	182% = 24px
85% = 11px	|	136% = 18px	|	189% = 25px	
92% = 12px	|	144% = 19px	|	197% = 26px
100% = 13px	|	152% = 20px	|   204% = 27px
107% = 14px	|	159% = 21px	|   211% = 28px
114% = 15px	|	167% = 22px |
122% = 16px	|   174% = 23px |
********************************************/

/* ------ Web Font ------ */

/* IE */
@font-face {
font-family: iconfont;
src: url(CONDENSEicon.eot);
}
/* Firefox, Opera, Safari */
@font-face {
font-family: iconfont;
src: url(CONDENSEicon.otf) format("truetype");
}

.icon {
font-family: iconfont;
font-weight: normal;
}

.icon-download:before {
content: "\00ed";
}
.icon-customize:before {
content: "w";
}
.icon-iphone:before {
content: "T";
}


/* ------ General Settings ------ */


img {
max-width: 100%;
height: auto;
width: auto\9;
}

/* ------#map img{
max-width: none;
}------ */

body {
background-color:#FFF;
}

.text-center {
text-align: center;
}

#wrapper {
width: 100%;
background-color:#FFF;
}

span.bold {
font-weight:bold;
}


/* ------ Header ------ */

header {
width: 100%;
background-color:#FFF;
}

#header-inner {
width: 930px;
margin: 0 auto;
overflow: hidden;
*zoom: 1;
}

#tagline {
padding-top: 30px;
line-height: 160%;
font-size: 80%;
color: #999;
float: right;
}


#logo {
padding: 30px 0;
}

#logo a {
display: block;
border: none;
}

#logo img {
width: 238px;
}

#gnav-btn {
display :none;
}

#gnav {
clear: both;
width: 100%;
background-color: #333;
background-color:#FFF;
margin-bottom:20px;
}

#gnav nav {
width: 930px;
margin: 0 auto;
overflow: hidden;
*zoom: 1;
}

#gnav nav ul {
float: left;
background-color:#FFF;
display: table;
table-layout:fixed;
width: 99.9%;
border-right: dotted 1px #999;
}

#gnav nav ul li {
display:table-cell;
text-align:center;
}

/*for IE7 */  
*:first-child+html #gnav nav ul li,
 {  
display: inline;  
zoom: 1;
width:150px;
}  


#gnav nav ul li a {
display: block;
border-left: dotted 1px #999;
border-bottom: none;
font-size: 80%;
background-color:#FFF;
padding: 0px 0;
color:#FFF;
}

#gnav nav ul li a:link,
#gnav nav ul li a:visited {
background-color:#FFF;
color: #333;
text-decoration: none;
}

#gnav nav ul li a:hover,
#gnav nav ul li a:active,
#gnav nav ul li a.current {
color: #E9508D;
text-decoration: none;
background-color:#FFF;
}


/* ------ Mainvisual ------ */

#mainvisual {
position: relative;
width: 100%;
overflow: hidden;
margin:10px 0 20px;
background-color:#FDF48A;
}

#mainvisual-inner {
position: relative;
padding-left: 50%;
}

#mainvisual-inner .img {
display: none;
float: left;
}

#mainvisual-arrow {
position: absolute;
z-index: 200;
width: 100%;
top: 40%;
left: 0;
margin-top: -10px;
}

#mainvisual-arrow-inner {
position: relative;
width: 100%;
max-width: 1100px;
margin: 0 auto;
}

#mainvisual-arrow .prev,
#mainvisual-arrow .next {
position: absolute;
width: 27px;
height: 27px;
overflow: hidden;
}

#mainvisual-arrow .prev {
left: 3%;
}

#mainvisual-arrow .next {
right: 3%;
}

#mainvisual-arrow a {
display: block;
width: 27px;
height: 54px;
}

#mainvisual-arrow a:link,
#mainvisual-arrow a:visited {
margin-top: 0px;
}

#mainvisual-arrow a:hover,
#mainvisual-arrow a:active {
margin-top: -27px;
}

#mainvisual-arrow a img {
vertical-align: top;
}

#mainvisual-btn {
width: 100%;
height: 10px;
margin: 20px 0 20px 0;
text-align: center;
}

#mainvisual-btn div {
display: inline-block;
width: 10px;
height: 10px;
margin: 0 8px;
overflow: hidden;
vertical-align: top;
}

#mainvisual-btn div {
*display: inline;
}

#mainvisual-btn span {
display: block;
width: 10px;
height: 20px;
}

#mainvisual-btn span.current {
margin-top: -10px;
}

#mainvisual-btn img {
vertical-align: top;
}


/* ------ Contents ------ */

#contents {
width: 930px;
margin: 0 auto;
padding-top: 20px;
overflow: hidden;
*zoom: 1;

}

#left-column {
float: left;
width: 930px;
}

article section {
padding: 0;
}


article section:first-child {
border-top: none;
}

article section h2 {
padding: 30px 0 20px;
font-size: 120%;
font-weight: bold;
line-height: 140%;
color: #333;
border-top: solid 1px #fff;
font-style: italic;
font-weight: 700;
}

#contents-title {
padding: 10px 0 20px;
font-size: 130%;
font-weight: bold;
line-height: 140%;
color: #333;
-webkit-text-shadow: 0px 1px 0px #fff;
text-shadow: 0px 1px 0px #fff;
border-top: none;
}

article section p {
font-size: 90%;
line-height: 160%;
color: #333;
margin-top:10px;
}


.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
margin-bottom:20px;
}
 
.video-container iframe,  
.video-container object,  
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.top-video {
margin-bottom:30px;
}


.column-set {
width: 960px;
*margin-bottom: 30px;
margin-right:-30px;
overflow: hidden;
*zoom: 1;
}



.column1 {
float: left;
width: 290px;
margin: 0 30px 20px 0;
}

.column1 img,
.column1 iframe {
text-align: center;
width: 100%;
margin-bottom: 10px;
}


section .third {
margin-right: 0;
}

.column-set h3,
.top-video h3 {
margin-bottom: -10px;
font-size: 100%;
font-weight: bold;
line-height: 140%;
text-align: center;
}

.column-set p,
.top-video p {
font-size: 83%;
text-align: center;
}

.box {
margin:20px 0px 30px;
padding: 0;
overflow: hidden;
}

article .box h2 {
padding: 0 0 10px;
border-top: none;
border-bottom:1px solid #333; 
}

article .box p {
font-size: 83%;
}


.news-box {
padding-bottom:20px;
font-size: 83%;
color: #333;
line-height: 140%;
margin:20px 0;
border-bottom:1px solid #DADADA;
}


.news-box dt {
width: 9em;
float: left;
}


dl.live-box {
padding-bottom:20px;
font-size: 83%;
color: #333;
line-height: 140%;
margin:20px 0 30px 0;
border-bottom:1px solid #DADADA;
overflow: hidden;
}

.live-box dt {
width: 9em;
float: left;
}

.live-box dd {
float: left;
overflow: hidden;
margin-left:10px;
}

.live-box dd.more {
margin-left:30px;
}


.gotop {
text-align: right;
margin-right:10%;
}




/* ------ Right Column ------ */

#right-column {
float: right;
width: 210px;
padding-bottom: 20px;
}

#right-column img {
margin-bottom: 20px;
}

#right-column .box {
margin-bottom: 20px;
padding: 0 15px 15px;
}

#right-column .nextlive {
margin-bottom: 20px;
padding: 0 15px 15px;
background-color:#68C2B3;
border-top: none;
}

#right-column .box h2 {
padding: 20px 0 10px;
font-weight: bold;
color: #FFF;
font-style: italic;
font-weight: 700;
}

#right-column .nextlive h2 {
padding: 10px 0 10px;
font-weight: bold;
color: #FFF;
border-bottom: #9ADACF 1px solid;
margin-bottom:10px;
font-style: italic;
font-weight: 700;
}

#right-column .box p {
font-size: 76%;
line-height: 160%;
color: #333;
}


/* ------ Footer ------ */

footer {
width: 100%;
}

#footer-inner {
width: 930px;
margin: 0 auto;
padding: 40px 0 20px;
border-top: 1px solid #F1F1F1;
}

footer nav,
#copyright {
text-align: center;
margin-bottom: 10px;
}

footer ul li {
display: inline-block;
*display: inline;
*margin-bottom: 12px;
padding: 0 10px 0 15px;
line-height: 100%;
font-size: 67%;
color: #999;
*zoom: 1;
}

footer ul li:first-child {
border-left: none;
}

footer a {
outline: none;
padding: 5px;
}

footer ul li a:link,
footer ul li a:visited {
border-bottom:none 0px;
}


/*-----------------------------------------------------	*/
/*	for - 979px					*/
/*-----------------------------------------------------	*/

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

#header-inner {
width: 90%;
}

#gnav nav {
width: 90%;
}

#bread-crumb ul {
width: 90%;
}

#contents {
width: 100%;
}

#left-column {
float: none;
width: 90%;
margin: 0 auto;
padding-bottom: 0;
}

.column-set {
width: 105%;
}

.column1 {
width: 45.5%;
margin-right: 4%;
}

#right-column {
float: none;
width: 90%;
margin: 0 auto;
*margin: 0 auto 20px;
overflow: hidden;
*zoom: 1;
}

#right-column-inner {
width: 105%;
}

#right-column .box {
float: left;
width: 24%;
margin-right: 4.1%;
padding: 0 2.5% 15px;
}


#footer-inner {
width: 100%;
}

}



/*-----------------------------------------------------	*/
/*	for - 767px					*/
/*-----------------------------------------------------	*/

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

#header-inner {
width: 100%;
}

#tagline {
float: none;
padding: 0 10px 5px;
text-align: center;
margin-top: 10px;
}

#logo {
padding: 0 0 15px;
text-align:center;
margin-top: 5px;
}

#logo a {
margin: 0 auto;
}

#mainvisual {
margin:0;
}


#gnav nav {
width: 100%;
}

#gnav nav ul {
float: none;
width: 100%;
border-left: none;
border-right: none;
border-bottom: solid 1px #CCC;
}

#gnav nav ul li {
float: left;
width: 50%;
*width: 49.9%;
}

#gnav nav ul li a {
display: block;
padding: 6px 0;
text-align: center;
border-right: solid 1px #CCC;
border-top: solid 1px #CCC;
border-left: none;
}

.news-box dt {
float: none;
width: auto;
margin-bottom:5px;
}

.news-box dd {
margin: 0 0 10px 0;
}

dl.live-box {
padding-bottom:0px;
}

.live-box dd.more {
clear: both;
margin:0 0 20px 0;
}

.live-box dt {
float: none;
width: auto;
margin-bottom:5px;
}

.live-box dd {
margin: 0 0 10px 0;
}


#right-column .box {
width: 39.5%;
margin-right: 4%;
padding: 0 3% 15px;
}

#right-column .ad {
width: 41.5%;
padding: 10px 2% 0;
}

}

/*-----------------------------------------------------	*/
/*	for - 479px					*/
/*-----------------------------------------------------	*/

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

.box {
padding: 5px 20px 20px;
}

#gnav nav ul li a{
padding:6px 0;
margin: 0;
}

#gnav nav ul li a:hover,
#gnav nav ul li a:active,
#gnav nav ul li a.current {
color: #666;
text-decoration: none;
}

.btn {
width: auto;
}

.btn a {
width: auto;
}

.column-set {
width: 100%;
*margin-bottom: 0;
}

.column1 {
float: none;
width: 100%;
}

.column1 img,
.column1 iframe {
text-align: center;
width: 70%;
margin-left:15%
}


.box {
margin-bottom: 20px;
}


#right-column {
*margin-bottom: 0;
}

#right-column-inner {
width: 100%;
}

#right-column .box,
#right-column .nextlive {
float: none;
width: auto;
margin-right: 0;
padding: 0 20px 20px;
}

#right-column .box p,
#right-column .nextlive p {
font-size: 83%;
}


#right-column {
text-align: center;
}


}