@charset "UTF-8";
/* CSS Document */

#mainarea{ height:400px; text-align:center;}
#readarea{ background:#e5e5db; padding:30px 0; width:100%; font-size:14px; line-height:24px;}

.subtitle{ margin:0 0 30px 0; text-align:center;}
#warp{width:960px; margin:0 auto;}
.topread iframe { float:left;}
.topread .main { float:left; margin:0 0 20px 0;}
.topread .read { width:505px; float:right; padding:5px 0 0 0;}
.topread .read h2 { font-size:20px; font-weight:bold; margin:0 0 5px 0; line-height:24px;}
.topread .read h2 span { font-size:12px; font-weight:normal;}
.topread .read h2 b{ font-size:14px;}
.topread .read p {}

.bnr{ clear:both; padding:0px 0 15px 0; width:960px; height:272px;}
.bnr span{ display:none;}
.bnr p{ float:left;}

#tabarea00{}
#tabarea01,#tabarea02,#tabarea04,#tabarea05,#tabarea07,#tabarea08{ display:none;}
.tabarea{ margin:0 0 50px 0; clear:both;}
.tabarea ul{}
.tabarea ul li{ float:left; margin:0 1px 0 0 ;}
.tabarea .content{ clear:both;background:#ffffff; padding:30px;}
.tabarea .content { margin:0 0 20px 0;}
.tabarea .content div:after { content: ""; display: block; clear: both;}
.tabarea .content h3{ font-size:20px; color:#e45f4c; font-weight:bold; margin:0 0 10px 0;}
.tabarea .content img { margin:0 0 10px 0;}
.tabarea .content .box-lf{ width:435px; float:left; margin:0 0 30px 0;}
.tabarea .content .box-rf{ width:435px; float:right; margin:0 0 30px 0;}
.tabarea .content h4{font-size:18px; font-weight:bold; margin:0 0 5px 0;}
.tabarea .content .box-lf p, .tabarea .content .box-rf p{ height:  7rem;}
.tabarea .content .box-lf:last-child p, .tabarea .content .box-rf:last-child p, .tabarea .content .box-lf:nth-last-child(2) p{ height:  auto;}

.onewarp{ clear:both;background:#ffffff; padding:30px;}
.onewarp .area{ clear:both; margin:0 0 30px 0;}
.onewarp .area .read{ float:right; width:450px;}
.onewarp .area .main{ float:left;}
.onewarp .area .read h3 { font-size:20px; font-weight:bold; margin:0 0 5px 0; line-height:28px;}
.onewarp .area .read h3 span { font-size:12px; font-weight:normal;}
.onewarp .area .read h3 b{ font-size:14px;}

/* =======================================
	hahakotabi 20180314
======================================= */
#hahako { display: block; clear: both; margin-bottom: 20px; padding: 15px; background-color: #fef5f8;}
#hahako .hahakoBox { background-color: #fff; border: solid #fc98b9 1px; padding: 20px 34px; position: relative;}
#hahako .hahakoBox:before, #hahako .hahakoBox:after { content: url(../img/anne/hahakotabi_frame.png); position: absolute; width: 101px; height: 11px; left: 405px;}
#hahako .hahakoBox:before { top: -5px;}
#hahako .hahakoBox:after { bottom: -5px; transform: rotate(180deg);}
#hahako .hahakoBox { text-align: center;}
#hahako .hahakoBox .subTitle { background-color: #fdd0df; margin: 5px 0 15px; font-size: 18px;}
#hahako .hahakoBox .hahakoCnts { clear: both; overflow: hidden; text-align: left;}
#hahako .hahakoBox .hahakoCnts .hahakoList {width: 643px;float: left;}
#hahako .hahakoBox h3 { font-size: 18px; font-weight: bold; color: #ee5386;}
#hahako .hahakoBox p { margin: 0 0 20px 0;}
#hahako .hahakoBox .atnText { font-size: 13px;}
#hahako .hahakoBox .atnText+.atnText { display: block;}
#hahako .hahakoBox .hahakoCnts > img { float: right;}
#hahako .hahakoBox .linkList { clear: both; overflow: hidden; margin: 0 130px;}
#hahako .hahakoBox .linkList li { width: 45%; background-color: #ee5386; margin: 0 auto;}
#hahako .hahakoBox .linkList li+li { margin-left: 5%;}
#hahako .hahakoBox .linkList li:hover { opacity: 0.7;}
#hahako .hahakoBox .linkList li a { color: #fff; text-decoration: none; font-size: 18px; padding: 5px 20px 5px 0; display: block; background: url(../img/anne/hahako_arrow.png) no-repeat 8px 14px; background-position: 96% 50%;}
#hahako .hahakoBox .hahakoList p { margin: 0 0 20px 1.2em;}
/* =======================================
	slideBottom BnrArea
======================================= */
#winterBnr { width:960px; margin: 30px auto 60px;}
#winterBnr .inBox{ width:900px; margin: 0px auto;}
#winterBnr a img:hover { opacity:0.8;}