@charset "utf-8";

/* -------------------------------------------------------
    asahi.com top CSS
    last update 2012.08.03 Ver3.28 ( NOT same as "topstyle2.css" now) 16:08
------------------------------------------------------ */

/* ----------------------------------------------------------
 スマホ・タブレットでのアクセス時に、アプリへの誘導を表示
----------------------------------------------------------- */

/*--------------------
 smartphone 共通
---------------------*/
#sl_iPhone,
#sl_AndroidSmp {height:200px; overflow:hidden; text-align:center;}
#sl_iPhone a,
#sl_AndroidSmp a {
	margin:0; position:absolute; top:0; left:0;
	width:990px;/*1000-(border)*/ height:90px;
	-webkit-tap-highlight-color:rgba(255,233,0,0.30); text-decoration:none !important;
	color:#fff; font-weight:bold; line-height:1em;
	text-shadow: 3px 3px 6px rgba(0,0,0,0.5);
	
	border-radius: 0 0 8px 8px;
	-webkit-border-radius: 0 0 8px 8px;
	box-shadow: 0px 0px 10px rgba(000,000,000,0.8);
	-webkit-box-shadow: 0px 0px 10px rgba(000,000,000,0.8);
	
	border: 5px solid #fff; border-top: 0;
	}

/*================
 iPhone
=================*/
#sl_iPhone a {
	padding:15px 0 83px; /* 1行の時：55px 0 45px, line-hight指定なし */
	font-size:72px; line-height: 80px;
	
	background: #bcdbef; /* Old browsers */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#bcdbef), color-stop(2%,#66a9d7), color-stop(50%,#3a8fc4), color-stop(51%,#3680b5), color-stop(100%,#406987)); /* Chrome,Safari4+ */
	background: -moz-linear-gradient(top,  #bcdbef 1%, #66a9d7 2%, #3a8fc4 50%, #3680b5 51%, #406987 100%); /* FF3.6+ */
	background: linear-gradient(top,  #bcdbef 1%,#66a9d7 2%,#3a8fc4 50%,#3680b5 51%,#406987 100%); /* W3C */
	}

/*================
 Android smartphone
=================*/
#sl_AndroidSmp a {
	padding:16px 0 78px; /* 1行の時：60px 0 40px, line-hight指定なし */
	font-size:70px; line-height: 74px;
	
	background: #bfd255; /* Old browsers */
	background: -moz-linear-gradient(top,  #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bfd255), color-stop(50%,#8eb92a), color-stop(51%,#72aa00), color-stop(100%,#9ecb2d)); /* Chrome,Safari4+ */
	background: linear-gradient(top,  #bfd255 0%,#8eb92a 50%,#72aa00 51%,#9ecb2d 100%); /* W3C */
	}


/*--------------------
 tablet 共通
---------------------*/
#sl_iPad,
#sl_AndroidTab {width:1000px; height:120px; overflow:hidden;
	margin:0; padding:15px 0 10px; text-align:left;
	background: #d5cea6; color:#3f3b26;
	}

/*--- Left area ---*/
#sl_iPad .InnerLeft,
#sl_AndroidTab .InnerLeft {
	float:left; margin-left: 30px;
	}
#sl_iPad .InnerLeft em.title,
#sl_AndroidTab .InnerLeft em.title {
	font-size:36px; font-weight:bold; font-style:normal; line-height:1.5em;
	text-shadow: 3px 3px 2px rgba(255,255,255,0.8);
	}
/* link btn */
#sl_iPad .InnerLeft div.btn_inside,
#sl_AndroidTab .InnerLeft div.btn_inside { 
	float:left;
	}
#sl_iPad .InnerLeft a.btn,
#sl_AndroidTab .InnerLeft a.btn {
	padding: 10px 15px; margin-right: 5px;
	color:#fff; font-size:18px; font-weight:bold; line-height:3em;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
	border: 2px solid #fff;
	
	border-radius: 6px;
	-webkit-border-radius: 6px;
	box-shadow: 0 1px 8px rgba(000,000,000,0.8);
	-webkit-box-shadow: 0 1px 8px rgba(000,000,000,0.8);
	
	background: #998d4c; /* Old browsers */
	background: -moz-linear-gradient(top,  #998d4c 1%, #59512c 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#998d4c), color-stop(100%,#59512c)); /* Chrome,Safari4+ */
	background: linear-gradient(top,  #998d4c 1%,#59512c 100%); /* W3C */
	}
/* 次回表示オフ */
/* close */
#sl_iPad .InnerLeft .close_inside,
#sl_AndroidTab .InnerLeft .close_inside {
	float:left; width:170px; margin:20px 10px 0 0;
	}
/* close[x] */
#sl_iPad .InnerLeft #close span.x,
#sl_AndroidTab .InnerLeft #close span.x {
	display: block; float:left;
	margin-right:8px;
	font-weight:bold; color:#fff;
	
	border: 3px solid #fff;
	border-radius: 16px;
	-webkit-border-radius: 16px;
	box-shadow: 0 1px 4px rgba(000,000,000,0.5);
	-webkit-box-shadow: 0 1px 4px rgba(000,000,000,0.5);
	background-color: #998d4c;
	}
/* text */
#sl_iPad .InnerLeft #close span.t,
#sl_AndroidTab .InnerLeft #close span.t {
	width:130px; display:block;
	text-decoration:none; font-size:16px;
	}

/*--- Right Area ---*/
#sl_iPad .InnerRight,
#sl_AndroidTab .InnerRight {
	float:right; margin:0 30px; padding:10px 15px;
	background-color:#efebce;
	font-size:16px; font-weight:bold; line-height:1.5em;
	
	border-radius: 8px;
	-webkit-border-radius: 8px;
	box-shadow: 2px 2px 5px rgba(000,000,000,0.3);
	-webkit-box-shadow: 2px 2px 5px rgba(000,000,000,0.3);
	}

/*================
 iPad
=================*/
#sl_iPad .InnerLeft {width:370px;}
#sl_iPad .InnerRight {width:510px;}

#sl_iPad .InnerLeft #close span.t {margin-left:25px;}

#sl_iPad .InnerLeft #close span.x {padding:0 4px 2px 5px; line-height:1em; font-size:18px;}
#sl_iPad .InnerLeft #close span.t {padding:2px 0 1px; line-height:1.12em;}/*16px*/

/*================
 Android tablet
=================*/
#sl_AndroidTab .InnerLeft {width:400px;}
#sl_AndroidTab .InnerRight {width:480px;}

#sl_AndroidTab .InnerLeft #close span.t {margin-left:30px;}

#sl_AndroidTab .InnerLeft #close span.x {padding:3px 7px 1px; line-height:1.1em;}
#sl_AndroidTab .InnerLeft #close span.t {padding:3px 0 1px;}

/* a:link, a:visited, a:hover, a:focus, a:active */