@charset "utf-8";
/**----------------------------------------------------------
 *CSS information 
 *
 * file name	: topics.css
 -----------------------------------------------------------*/
#pageTopics #contents {width:910px;}

#pageTopics .left{
 margin: 45px 0 95px 0;
 float:left; 
 width:180px;
}

#pageTopics .left ul {padding-left:10px;}
#pageTopics .left li{
 list-style:none;
 margin-bottom:45px;
 cursor: pointer;
 background:url(/topics/images/year.gif) no-repeat;
 display:block;
 text-indent:-9999px;
 width:77px;
 height:29px;
}

#pageTopics .left li.y2023 {background-position:-103px -480px;}
#pageTopics .left li:hover.y2023,
#pageTopics .left .y2023.open {background-position:0 -480px;}

#pageTopics .left li.y2021 {background-position:-103px -400px;}
#pageTopics .left li:hover.y2021,
#pageTopics .left .y2021.open {background-position:0 -400px;}

#pageTopics .left li.y2020 {background-position:-103px -360px;}
#pageTopics .left li:hover.y2020,
#pageTopics .left .y2020.open {background-position:0 -360px;}

#pageTopics .left li.y2019 {background-position:-103px -320px;}
#pageTopics .left li:hover.y2019,
#pageTopics .left .y2019.open {background-position:0 -320px;}

#pageTopics .left li.y2018 {background-position:-103px -280px;}
#pageTopics .left li:hover.y2018,
#pageTopics .left .y2018.open {background-position:0 -280px;}

#pageTopics .left li.y2017 {background-position:-103px -240px;}
#pageTopics .left li:hover.y2017,
#pageTopics .left .y2017.open {background-position:0 -240px;}

#pageTopics .left li.y2016 {background-position:-103px -200px;}
#pageTopics .left li:hover.y2016,
#pageTopics .left .y2016.open {background-position:0 -200px;}

#pageTopics .left li.y2015 {background-position:-103px -160px;}
#pageTopics .left li:hover.y2015,
#pageTopics .left .y2015.open {background-position:0 -160px;}

#pageTopics .left li.y2014 {background-position:-103px -120px;}
#pageTopics .left li:hover.y2014,
#pageTopics .left .y2014.open {background-position:0 -120px;}

#pageTopics .left li.y2013 {background-position:-103px -80px;}
#pageTopics .left li:hover.y2013,
#pageTopics .left .y2013.open {background-position:0 -80px;}

#pageTopics .left .y2012 {background-position:-103px -40px;}
#pageTopics .left li:hover.y2012,
#pageTopics .left .y2012.open {background-position:0 -40px;}

#pageTopics .left .y2011 {background-position:-103px 0;}
#pageTopics .left li:hover.y2011,
#pageTopics .left .y2011.open {background-position:0 0;}


#pageTopics .right {
 margin: 45px 0 95px 0;
 width:730px;
 float:right;
}
#pageTopics .right ul {
 width:700px;
 border-top:1px solid #ddd;
}
#pageTopics .right ul li {
 clear:both;
 overflow:hidden;
 background:url(/images/common/icon.png) no-repeat 12px 50%;
 font-size:1.6em;
 list-style:none;
 padding:20px 30px 20px 40px;
 border-bottom:1px solid #ddd;
}
#pageTopics .right ul li strong {
 font-size:1.4em;
 display:block;
}
#pageTopics .right ul li span {
 display:block;
 font-size:0.7em;
 padding-bottom:3px;
}

/* movie */
#Ymov {
 width:270px;
 height:152px;
 float:left;
 margin:0 20px 0 0;
}
.disnon {display:none;}

/* topics詳細 */
#pageTopics .topics_inner {
 font-size:1.4rem;
 line-height:180%;
 overflow:hidden;
 border:1px solid #ddd;
 padding:70px;
 margin:50px 0;
}
#pageTopics .topics_inner h1 {
 text-align:center;
 font-size: 2.2rem;
 line-height:140%;
 margin:5px 0 10px 0;
}
#pageTopics .topics_inner h2 {
 font-size:1.6em;
 line-height:160%;
 margin:5px 0;
}
#pageTopics .topics_inner strong,
#pageTopics .topics_inner h3 {
 font-size: 1.7rem;
 line-height:140%;
 margin:5px 0;
}
p {margin-bottom:20px;}
p.topics_images {text-align:center;}
p.day {
 font-size: 1.2rem;
 padding:15px 0;
 text-align:right;
}
hr {margin:35px 0;}
#pageTopics .contactArea{
 padding-top: 35px;
 border-top: 1px solid #ccc;
}
#pageTopics .contactArea p{ font-size: 1.2rem;}


#pageTopics dl {margin:5px 0 20px 0;padding:0;}
#pageTopics dt {
 font-weight:bold;
 clear:left;
 float:left;
 width:3em;
 margin:0;
 padding:0 0 0 5px;
}
#pageTopics dd {
 margin: 0 0 0 3em;
 padding:0 0 0 5px;
}

/* ガイドラインtable */
.guideline_tb{
 border: solid 1px;
 border-collapse: collapse;
 width: 100%;
 margin: 40px 0 20px;
}
.guideline_tb caption{ text-align: left;}
.guideline_tb tr,
.guideline_tb td,
.guideline_tb th{
 border: solid 1px;
 padding: 4px;
}
.guideline_tb th{background-color: #eee;}
.guideline_tb tr th:first-child{ width: 42%;}


/* 181214 */
#pageTopics .link { margin-bottom: 20px;}
#pageTopics .link p {
 font-weight: bold;
 margin-bottom: 0;
}
#pageTopics .link li {
 background: url(/topics/images/arrowBlack.svg) no-repeat center left;
 background-size: 6px 7px;
 display: table;
}
#pageTopics .link li a {
 padding-left: 13px;
 text-decoration: underline;
}


/*お問い合わせはこちらボタン*/
.toContact{
 background-color: #EEE;
 padding: 18px 20px;
 display: block;
 margin: 50px auto 80px;
 width: 280px;
 border-radius: 5px;
 text-align: center;
 font-size: 1.6rem;
 font-weight: 500;
 transition: background-color 0.2s;
}
.toContact:hover{
 background:#CCC;
 text-decoration: none;
}

/* footer */
#contents {
 width:100%;
 margin:0 auto;
 float: none;
 clear: both;
 padding-bottom: 387px;/*このpxは#footerのheightとつながっています*/
 overflow:auto;
}
#gFooter {
 background-color:#DDDDDD;
 clear: both;
 float: none;
 height: 367px;/*このpxは#contentsのpadding-bottomとつながっています*/
 position: absolute;
 *left: 0%;/* for IE6/7 */
 bottom: 0;
 width: 100%;
}
