@charset "UTF-8"; 

/* //////////////////////////////////////////////////////////////////// */ 
/* ///// PC全ページ共通CSS //////////////////////////////////////////// */ 
/* //////////////////////////////////////////////////////////////////// */ 

/* ================================================== 
font 
================================================== */ 
html {font-size: 62.5%;}/*基本フォントサイズ10px*/ 

body {
	background-color:fff !important;
	color:#000 !important; 
	line-height:1.8 !important;
	letter-spacing:1px !important;
	/*ゴシック系*/
	font-family:"Karla","Helvetica Neue",Helvetica,"游ゴシック",YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,sans-serif !important;
	
	/*明朝系*/
	/*font-family:"Times New Roman","游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN",serif;*/
	 -webkit-font-smoothing: antialiased !important;
	-ms-text-size-adjust: 100% !important;
	-webkit-text-size-adjust:100% !important; /*  iPhoneの文字サイズバグの回避  */
} 

img{
	vertical-align:bottom !important;
}

p{
	max-height:99999px;
}
#wrapper {font-size:14px; font-size:1.4rem;} 

/* ================================================== 
link 
================================================== */ 

a{
	-webkit-transition:.3s ease;
	-moz-transition:.3s ease;
	-o-transition:.3s ease;
	transition:.3s ease;
}
a:link {color:#000; text-decoration:none;} 
a:visited {color:#000; text-decoration:none;} 
a:hover {color:#000; text-decoration:none;} 
a:active {color:#000; text-decoration:none;} 

a:hover img.csshover{ 
	filter:alpha(opacity=60); 
	-moz-opacity: 0.6; 
	opacity: 0.6; 
	-webkit-transition:.3s ease;
	-moz-transition:.3s ease;
	-o-transition:.3s ease;
	transition:.3s ease;
} 

a { /* FireFoxのリンク選択時の点線を消す */ 
overflow: hidden; 
outline: none; 
} 


/* ================================================== 
base (reset) 
================================================== */ 
html { 
margin:0; 
padding:0; 
} 

body { 
margin:0 auto; 
padding:0; 
position:relative; 
text-align:center; 
} 

@media screen and (max-width:640px){ 
body { 
width: 100% !important; 
min-width:100%; 
background:#fff; /*Androidのブロック幅バグ回避*/ 
}
}

#wrapper { 
width:100%;
margin:0 auto;
text-align:left;
} 



h1, h2, h3, h4, h5, h6, p {margin:0; padding:0; font-size:100%; font-weight:normal;} 

ul, ol {margin:0; padding:0; vertical-align:baseline; background:transparent;} 
ol, li {list-style:none;} 

img {border:none; line-height:0; font-size:0; vertical-align:text-bottom;} 
img, object, embed, video {max-width: 100%;} 

a { 
margin:0; 
padding:0; 
font-size:inherit; 
background:transparent; 
} 

th, td { 
font-style:normal; 
font-weight:normal; 
font-size:inherit; 
empty-cells:show; 
} 

input, select { 
vertical-align:middle; 
} 

input, textarea, select { 
font-family:inherit; 
font-size:inherit; 
font-weight:inherit; 
/*border:0;*/ 
} 

pre { 
white-space: -moz-pre-wrap; /* Mozilla */ 
white-space: -pre-wrap; /* Opera 4-6 */ 
white-space: -o-pre-wrap; /* Opera 7 */ 
white-space: pre-wrap; /* CSS3 */ 
word-wrap: break-word; /* IE 5.5+ */ 
} 

* { 
-webkit-box-sizing: border-box;/* ボックス内のwidth優先 */ 
-moz-box-sizing: border-box; 
box-sizing: border-box; 
} 

/* ================================================== 
header 
================================================== */ 
#hdr{
	position: relative;
	margin:20px;
}

#hdr h1{
	max-width: 250px;
	display:inline-block;
	margin:0 0 15px 0;
}

#container{ 
	width:100% !important;
	margin:0 auto;
} 

#hdr .time{
	font-weight:bold;
	font-size:1.2rem;
	margin:0 0 10px 0;
}

 #snsArea {
	
 }
 
 #snsArea #gigyaShare {
    display: inline-block;
}

 #snsArea #gigyaShare > div {
	display: inline-block;
	padding-left: 12px;
	vertical-align: bottom;
}

/* ================================================== 
nav 
================================================== */ 

.slide_open #all_wrap{
	height:1100px;
	overflow:auto;
}

.slide_open_2{
	overflow: hidden !important;
}

.slide_open_2 #slide_menu_2{
	height:100%;
}

.nav_btn_2{
	position: absolute;
	right:20px;
	top:20px;
	cursor:pointer;
	z-index:9999;
}


.slide_open .nav_btn{
	position: absolute;
	right:20px;
	top:30px;
	cursor:pointer;
	z-index:9999;
}


.nav_btn{
	position: absolute;
	right:20px;
	top:0px;
	cursor:pointer;
	z-index:9999;
}
.nav_btn_2 p,
.nav_btn p{
	font-size:1.2rem;
	font-weight:bold;
}

.menu-trigger_2,
.menu-trigger_2 span,
.menu-trigger,
.menu-trigger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}

.menu-trigger_2,
.menu-trigger {
	position: relative;
	width:40px;
	height:30px;
}

.menu-trigger_2 span,
.menu-trigger span {
	position: absolute;
	left: 0;
	width: 100%;
	height: 4px;
	background-color:#000;
}

.menu-trigger_2 span:nth-of-type(1),
.menu-trigger span:nth-of-type(1) {
	top: 0;
}

.menu-trigger_2 span:nth-of-type(2),
.menu-trigger span:nth-of-type(2) {
	top: 13px;
}

.menu-trigger_2 span:nth-of-type(3),
.menu-trigger span:nth-of-type(3) {
	bottom:0px;
}

.menu-trigger_2.active span:nth-of-type(1),
.menu-trigger.active span:nth-of-type(1) {
	-webkit-transform: translateY(12px) rotate(-45deg);
	transform: translateY(12px) rotate(-45deg);
}

.menu-trigger_2.active span:nth-of-type(2),
.menu-trigger.active span:nth-of-type(2) {
	opacity: 0;
}
.menu-trigger_2.active span:nth-of-type(3),
.menu-trigger.active span:nth-of-type(3) {
	-webkit-transform: translateY(-12px) rotate(45deg);
	transform: translateY(-12px) rotate(45deg);
}


#slide_menu{
	position: absolute;
	top:0;
	left:0;
	z-index:9998;
	background:#fff;
	display:none;
	width:100%;
	height:1100px;
}

.slide_logo{
	max-width: 250px;
	padding:30px 0 30px 20px;
}



.slide_close_btn_2,
.slide_close_btn{
	width:220px;
	margin:60px auto 0;
	display:block;
	font-size:2rem;
	line-height:2rem;
	padding:20px 10px;
	font-weight:bold;
	color:#fff !important;
	background:#000;
	text-align:center;
	border:2px solid #000;
	cursor:pointer;
}

.slide_close_btn_2 span,
.slide_close_btn span{
	font-size:3rem;
}
	

#slide_menu_2{
	position: fixed;
	top:0;
	left:0;
	z-index:9997;
	width:100%;
	display:none;
	overflow:auto;
}

.top_area{
	position:relative;
	background:#fff !important;
}

.slide2_area{
	position: absolute;
	top:112px;
	left:0;
	background:#fff !important;
	display:none;
	width:100%;
	height:1000px;
}
 .gnav{
	margin:0 0 60px 0;
}

/*TOPナビ*/
.home_cnt .gnav .nav_img{
	margin-bottom:10px;
}

.slide2_area .gnav,
.home_cnt .gnav{
	width:100%;
	letter-spacing:-0.4rem;
}

.slide2_area .gnav li,
.home_cnt .gnav li{
	width:100%;
	display:inline-block;
	letter-spacing:normal;
	vertical-align:bottom;
	border-bottom:2px solid #000;
}


.slide2_area .gnav li a,
.home_cnt .gnav li a{
	display:block;
	width:100%;
	height:100%;
	position: relative;
	z-index: 2;
	padding: 10px 60px;
	font-weight: bold;
	font-size: 1.6rem;
	line-height: 1.8rem;
}

.nav_01{
	background:#dee2cf;
}

.nav_01 a{
	background:url(/original/radiodonuts/sp/common/img/d1_off.png) no-repeat 20px center , url(/original/radiodonuts/sp/common/img/nav_arrow.png) no-repeat 336px center;
	background-size:20px 20px, 12px 20px;
}

.nav_02{
	background:#fdf4e9;
}

.nav_02 a{
	background:url(/original/radiodonuts/sp/common/img/d2_off.png) no-repeat 20px center , url(/original/radiodonuts/sp/common/img/nav_arrow.png) no-repeat 336px center;
	background-size:20px 20px, 12px 20px;
}

.gnav .nav_03{
	background:#fcf3fa;
}

.nav_03 a{
	background:url(/original/radiodonuts/sp/common/img/d3_off.png) no-repeat 20px center , url(/original/radiodonuts/sp/common/img/nav_arrow.png) no-repeat 336px center;
	background-size:20px 20px, 12px 20px;
}

.nav_04{
	background:#eadfdd;
}

.nav_04 a{
	background:url(/original/radiodonuts/sp/common/img/d4_off.png) no-repeat 20px center , url(/original/radiodonuts/sp/common/img/nav_arrow.png) no-repeat 336px center;
	background-size:20px 20px, 12px 20px;
}

.nav_05{
	background:#d8dbe6;
}

.nav_05 a{
	background:url(/original/radiodonuts/sp/common/img/d5_off.png) no-repeat 20px center , url(/original/radiodonuts/sp/common/img/nav_arrow.png) no-repeat 336px center;
	background-size:20px 20px, 12px 20px;
}


.nav_06{
	background:#e6eeea;;
}

.nav_06 a{
	background:url(/original/radiodonuts/sp/common/img/d6_off.png) no-repeat 20px center , url(/original/radiodonuts/sp/common/img/nav_arrow.png) no-repeat 336px center;
	background-size:20px 20px, 12px 20px;
}

.nav_07{
	border-left:8px solid #8A8A8A;
}


/*//ナビゲーション装飾*/

/* ================================================== 
contents 
================================================== */ 

h2{
	font-size:2.2rem;
	font-weight:bold;
	line-height:2.2rem;
	letter-spacing:0rem;
	border-bottom:4px solid #161616;
	padding:0 0 5px 20px;
}

strong{
	color:#B17940;
}
/* PAGETOP 
------------------------------ */ 
.social_nav{
	text-align:center;
	margin:0 0 80px 0;
}




.social_nav li{
	width:150px;
	height:auto;
	display:inline-block;
	border:3px solid #000; 
	vertical-align:bottom;
}

.social_nav li a{
	padding:15px 0 0 0;
	display:block;
	width:100%;
	height:100%;
	font-weight:bold;
	font-size:1.4rem;
}



/* ================================================== 
footer 
================================================== */ 
#footer{
	border-top:3px solid #000;
	width:100% !important;
	margin:100px auto 0;
	position:relative;
	text-align:center;
}

#footer .ft_btn_l{
	position:absolute;
	left:20px;
	top:45px;
}

#footer .ft_btn_r{
	position:absolute;
	right:20px;
	top:60px;
}

#footer .copy{
	padding:110px 0 60px;
	font-size:1.1rem;
	font-weight:bold;
}

#commonFooter {
    width: 100%;
    position: static;
}

#commonFooterInner {
    padding: 15px 0;
    width: 100%;
    background-color: #282828;
    text-align: center;
}

/* //////////////////////////////////////////////////////////////////// */ 
/* //////////////////////////////////////////////////////////////////// */ 
/* //////////////////////////////////////////////////////////////////// */ 

/* ================================================== 
6. other 
================================================== */ 


/* -------------------------------------------------- 
class指定のみでマウスオーバー効果 (base_pc.js) 
※fadeの透過時間は、base_pc.jsにて調節 
-------------------------------------------------- */ 
.swap {} /*ON/OFF　　※同ディレクトリ内にある[ 同じimg名 + _on ]の画像に変わる*/ 
.swapfade {} /*ON/OFF　　※同ディレクトリ内にある[ 同じimg名 + _on ]の画像に変わる フェード効果付き*/ 
.fade {} /*半透過*/ 
.fadefix {} /*完全透過　　※要素の背景にON画像の設定必要*/ 


/* -------------------------------------------------- 
アニメーションスクロール 
-------------------------------------------------- */ 
.scrollto {} /*jquery.scrollto.jsを利用*/ 


/* -------------------------------------------------- 
ブロック要素全体をクリックにて、ブロック要素内にあるリンク先へ遷移 (base_pc.js) 
-------------------------------------------------- */ 
.clickable { cursor:pointer;} 

/* -------------------------------------------------- 
clrfix 
フロートした子要素しかもたない親ブロック要素の高さを確立する 
-------------------------------------------------- */ 
/*親ブロック要素のclassにclrfixを追加*/ 
.clrfix:before, 
.clrfix:after { 
content:""; 
display:table; 
} 
.clrfix:after { clear:both; } 



/* //////////////////////////////////////////////////////////////////// */ 
/* //////////////////////////////////////////////////////////////////// */ 
/* //////////////////////////////////////////////////////////////////// */ 


.comment_txt {
	padding:5px;
	line-height: 1.4; 
}