@charset "utf-8";

/*
	* Name: paper.css
	* License: MIT License
	  - http://sourceforge.jp/projects/opensource/wiki/licenses%2FMIT_license

	* Contents:
	  - 領域設定 - レイアウト -
	    - 01. 領域設定 - ID指定 -
	    - 07. 領域設定 - Main -
	  - 個別設定 - Top -
*/


/* Stylesheet Document */

@media all {

	/* ========================================
	   * 領域設定 - レイアウト -
	======================================== */

	#paper {
	}

	#paper footer {
		border-top: 4px solid #0787B6;
	}


	/* ========================================
	   * 01. 領域設定 - ID指定 -
	======================================== */

	#paper #contents {
		background-image: url("../../../img/pc/paper/bg_border.gif");
		border-bottom: 1px solid #D1EAF1;
		border-top: 1px solid #D1EAF1;
	}


	/* ========================================
	   * 07. 領域設定 - Main -
	======================================== */

	#paper #main h3 {
		border-bottom-color: #0787B6;
	}

	#paper #main h3 span {
		background-image: url("../../../img/pc/paper/icon_circle_paper.png");
	}

	#paper #main div.tab {
		border-bottom: 3px solid #055370;
	}

	#paper #main div.tab ul li a.on,
		#paper #main div.tab ul li a:hover {
			background-color: #2597C2;
			background-image: url("../../../img/pc/paper/bg_tab_on.png");
			border-bottom: 1px solid #2597C2;
	}

	#paper #main div.weekly {
		margin-top: -8px;
	}

	#paper #main div.weekly ul {
		margin-left: auto;
		margin-right: auto;
		width: 588px;
	}

	#paper #main div.weekly ul li {
		margin-left: 3px;
		margin-right: 3px;
		width: 78px;
	}


	#paper #main div.thumbnail div.container h4 {
		background-color: #0787B6;
	}

	#paper #main div.pagenation ul li a {
		color: #CB3D1F;
		border: 1px solid #CB3D1F;
	}

	#paper #main div.pagenation ul li a:hover,
		#paper #main div.pagenation ul li a.current,
			#paper #main div.pagenation ul li a.prev,
				#paper #main div.pagenation ul li a.next {
					background-color: #CB3D1F;
	}


	/* ========================================
	   * 個別設定 - Top -
	======================================== */

	#paper.home #main h3 {
		margin-bottom: 20px;
	}


	/* ========================================
	   * 個別設定 - サンプル紙面について -
	======================================== */

	#paper.sample #main div.paragraph div.photoarea,
		#paper.sample #main div.paragraph div.commentarea {
			float: left;
	}

	#paper.sample #main div.paragraph div.photoarea {
		background: none;
		margin-left: 0;
		margin-right: 32px;
		padding: 0;
		width: 180px;
	}

	#paper.sample #main div.paragraph div.photoarea a,
		#paper.sample #main div.paragraph div.photoarea a img,
			#paper.sample #main div.paragraph div.photoarea h6 span {
				display: block;
	}

	#paper.sample #main div.paragraph div.photoarea a {
		border: 1px solid #D3D3D1;
		margin: 0 0 10px 0;
		padding: 8px;
	}

	#paper.sample #main div.paragraph div.photoarea h6 {
		border: 1px solid #E5E5E3;
		padding: 1px;
	}

	#paper.sample #main div.paragraph div.photoarea h6 span {
		background-color: #F5F5F4;
	}

	#paper.sample #main div.paragraph div.photoarea h6 span a {
		border: none;
		color: #464646;
		display: inline;
		font-size: 80%;
		font-weight: normal;
		padding: 0;
	}

	#paper.sample #main div.paragraph div.commentarea {
		width: 368px;
	}


	/* ここから */
	#paper #main .bg_blue {
		background-color: #90C1DE;
		margin-bottom: 12px;
		padding: 10px;
		border-radius: 5px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
	}

	#paper #main .bg_blue .box_white {
		position: relative;
		background-color: #FFFFFF;
		box-shadow: 4px 4px 4px 0 rgba(0,0,0,0.2);
		margin: 35px auto 0 auto;
		padding: 20px 0 0 0;
	}

	#paper #main .bg_blue .box_white:first-child {
		margin-top: 29px;
	}

	#paper #main .bg_blue .box_white h2 {
		position: absolute;
		top: -29px;
		left: 0;
		width: 185px;
		height: 19px;
		padding: 5px 20px 5px 0;
		font-size: 120%;
		color: #649EC4;
		background: url(../../../img/pc/paper/bg_h2.png) no-repeat left top;
		text-align: center;
	}

	#paper #main .bg_blue .box_white #viewer ul {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-box;
		display: -webkit-flexbox;
		display: -moz-flexbox;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: flex;
		-webkit-box-lines: multiple;
		-moz-box-lines: multiple;
		-webkit-flex-wrap: wrap;
		-moz-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		list-style-type: none;
		margin: 0;
		padding: 0;
	}

	#paper #main .bg_blue .box_white #viewer li {
		position: relative;
		width: 132px;
		margin: 0 0 0 19px;
		padding: 0 0 20px 0;
		line-height: 1.2;
		text-align: center;
	}


	#paper #main .bg_blue .box_white #viewer.btnon li {
		padding-bottom: 6em;
	}

	#paper #main .bg_blue .box_white #viewer li span {
		display: block;
		height: 17px;
		padding: 5px;
		font-size: 90%;
		color: #4D4D4D;
		line-height: 1.6;
		text-align: left;
		background: url(../../../img/pc/paper/bg_tab.png) no-repeat left top;
	}

	#paper #main .bg_blue .box_white #viewer .thumbnail {
		padding: 5px;
		margin: 0 0 4px 0;
		border: solid 1px #B3B3B3;
	}

	#paper #main .bg_blue .box_white #viewer .btn {
		display: block;
		position: absolute;
		right: 0;
		bottom: 20px;
		left: 0;
		width: 5.5em;
		padding: 7px;
		margin: 10px auto;
		font-size: 120%;
		font-weight: bold;
		color: #649EC4;
		border: solid 1px #649EC4;
		text-align: center;
		box-shadow:2px 2px 0 0 #649EC4;
		-moz-box-shadow:2px 2px 0 0 #649EC4;
		-webkit-box-shadow:2px 2px 0 0 #649EC4;
	}
	/* ここまで */
}
