@charset "utf-8";

/* ==========================================================================
	 common definitions for sankei-digital mobile service

   add:2017/3/13 改修
   add:2017/3/6 改修
   add:2017/1/30 改修
   add:2016/11/17 newsList add thumbnail
   add:2016/08/30 header-icon sankeiWest IN

========================================================================== */


/* ==== index ===============================================================


0. global styles
	0-0. layout

1. header styles
	1-1. header
	1-2. navigation

2. footer styles
	2-1. quicklink
	2-2. switchView
	2-3. footerMainarea
	2-4. copyright
	2-5. shortcut

3. main module styles　
	3-1. top pickup flash
	3-2. top news
	3-3. mod editors pickup
	3-4. mod premium
	3-5. mod dailynews
	3-6. mod iRONNA
	3-7. mod sankeiphoto
	3-8. mod ranking
	3-6. module hotPickup
	3-8. module photolist
	3-9. module induction
	3-10. module column
	3-11. mod quicklink
	3-12. mod GQ JAPAN + Wired
	3-13. module QA
	3-14. module photo gallery
  3-15. module travel sns

4. index styles リスト
	4-1. index text
	4-2. index photo
	4-3. index feature
	4-4. index ranking
	4-5. index region
	4-6. index photo+text

5. detail styles
	5-1. news detail
	5-2. photo detail
	5-4. photozoom detail

6. others
	6-1. static
	6-2. slide menu
	6-3. shimen view
	6-4. frequency
	6-5. swiper
	6-6. service menu
	6-7. button press
	6-8. contentOpener action
	6-9. listUpdater action
	6-10. search
	6-11. video
	6-12. english
	6-13. top module youtube

========================================================================== */


/* --------------------------------------------
0. global styles
--------------------------------------------*/


/* ===== common ====================================================================== */

#contentsContainer {
    width: 100%;
    background-color: #fff;
    margin: 0 auto;
}

.contentBox {
    background-color: #fff;
}
.contentWrap:after {
    content: ".";
    clear: both;
    height: 0;
    font-size: 0.1em;
    line-height: 0;
    display: block;
    visibility: hidden;
}

#additional {
    text-align: center;
    width: 100%;
    margin: 0 auto;
}


/* ===== js処理 ====================================================================== */

.no-js .js-holder {
    display: none;
}

.js .js-holder-ready {
    height: 1px;
    visibility: hidden;
    overflow: hidden;
}


/*-- .js以下では付けられた要素の状態に合わせる */


/* 汎用
.js .not-fallback {
	display: none !important;
}
*/


/* イメージロード */

.js .image-loading {
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center 20%;
    background-repeat: no-repeat;
    width: 80px;
    height: 80px;
    padding: 0 !important;
}


/*--- Android 2.3 Lite が文字を消さない */

.js a.image-loading {
    color: transparent;
}

.js .image-loading img {
    display: none;
}


/* ===== 汎用parts ====================================================================== */


/*--- リンクボタン */

.more {
    font-size: 1.2rem;
    line-height: 1.4;
    display: block;
    margin: 6px;
    text-align: right;
}

.more a, .more span {
    display: inline-block;
    padding: 6px 24px 6px 10px;
    vertical-align: middle;
    background: url(../../../images/v2/common/arrow_more.png) #efefef 96% 50% no-repeat;
    background-size: 8px 12px;
}


/*--- タイトル追記情報 */


/*--- fallback用遷移ボタン */

.nextBtn, .prevBtn {
    width: 70%;
    margin: 10px auto !important;
}

.nextBtn a, .prevBtn a {
    display: block;
    background: -moz-linear-gradient(top, white, #eeeeee);
    background: -webkit-gradient(linear, left top, left bottom, from(white), to(#eeeeee));
    border: 1px solid #ccc;
    border-radius: 4px;
    font-size: 1.5em;
    font-size: 1.5rem;
    text-align: center;
    height: 40px;
    line-height: 40px;
    text-shadow: 0 1px 0 #fff;
}

.nextBtn a:hover, .prevBtn a:hover {
    background: -moz-linear-gradient(top, #eeeeee, white);
    background: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(white));
}


/*--- 記事詳細：続きを読む */

.moreNews {
    font-size: 1.4rem;
    line-height: 1.4;
    display: block;
    margin: 15px;
    text-align: center;
    border: 1px solid #efefef;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
}

.moreNews a, .moreNews span {
    display: block;
    padding: 10px;
    vertical-align: middle;
    background: none;
}


/* 遷移タイプ */

.linkTo {
    text-align: center;
    margin: 5px;
    border: 1px solid #595959;
}


/* ===== 画像size ====================================================================== */

.photo {
    display: block;
    float: left;
    margin: 0 10px 5px 0;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}


/*--- 総合トップの場合 */

.modToppick article .photo, .modToplist .photo, #modPickup .photo, #modSiteinfo .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

.photo img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}

.actual-size {
    width: auto !important;
}

.actual-size img {
    width: 80px !important;
}

.no-image {
    background: url(../../../images/v2/common/no-image.png) center no-repeat;
    background-position: center;
    background-repeat: no-repeat;
    width: 30px;
    height: 30px;
}

.no-image img {
    display: none;
}

.backgroundsize .no-image {
    background-image: url(../../../images/v2/common/no-image.png);
    background-size: cover;
    width: 80px;
    height: 80px;
}


/*- サイズの組み合わせ-----*/

.articleText .size-thumb1 {
    width: 125px;
    height: auto;
    overflow: visible;
}


/* ===== アプリ展開時の処理 ====================================================================== */

.device-skapp .headerWrap, .device-skapp .footerWrap {
    display: none;
}


/*アプリ展開時：新聞タブ非表示*/

.device-skcrossapp #globalNav_top nav div ul li.swiper-slide:last-child {
    width: 0;
    display: none;
}


/* --------------------------------------------
1. header styles
--------------------------------------------*/


/* ===== 1-1. header ====================================================================== */

.headerWrap {
    width: 100%;
    color: #333;
    background-color: #fafafa;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-top: 3px solid #014e94;
    border-bottom: 1px solid #efefef;
    /*	height: 55px; */
}

.headerWrap header {
    border-top: 1px solid #fff;
}

.headerWrap #headerMod {
    position: relative;
    height: 55px;
    border-top: 1px solid #014e94;
}

.headerWrap #headerMod a {
    color: #fff;
}

#headerMod #logo {
    position: absolute;
    top: 10px;
    left: 10px;
    height: 34px;
}

#headerMod #logo a {
    display: block;
}

#headerMod #logo img {
    height: 34px;
}


/* ===== 1-2. navigation ====================================================================== */

#headerMod .fncbtn {
    position: absolute;
    top: 8px;
    right: 10px;
    font-size: 0;
}

#headerMod .fncbtn li {
    display: inline-block;
    margin-left: 5px;
    height: 40px;
}

#headerMod #sideNav a, #headerMod #sideNav span {
    display: block;
    text-indent: -99999px;
    background: url(../../../images/v2/common/icon_header_genre.png) 3px bottom no-repeat;
    background-size: 34px 34px;
    height: 34px;
    width: 40px;
    cursor: pointer;
}

#headerMod .btnSankeiWest a {
    display: block;
    text-indent: -99999px;
    background: url(../../../images/v2/common/icon_header_sankeiWest.png) 0px bottom no-repeat;
    background-size: 45px 26px;
    height: 32px;
    width: 45px;
    cursor: pointer;
}

#headerMod .btnFlash a {
    display: block;
    text-indent: -99999px;
    background: url(../../../images/v2/common/icon_header_flash.png) 3px bottom no-repeat;
    height: 34px;
    width: 40px;
    cursor: pointer;
}

#headerMod .btnRanking a {
    display: block;
    text-indent: -99999px;
    background: url(../../../images/v2/common/icon_header_ranking.png) 3px bottom no-repeat;
    height: 34px;
    width: 40px;
    cursor: pointer;
}

#headerMod #btnService a, #headerMod #btnService span {
    display: block;
    text-indent: -99999px;
    background: url(../../../images/v2/common/icon_header_service.png) 3px bottom no-repeat;
    height: 34px;
    width: 40px;
    cursor: pointer;
    background-size: contain;
}
#headerMod .btnFlash a,
#headerMod .btnRanking a,
#headerMod #btnService a{
    background-size: 34px 34px;
}

/* --------------------------------------------
2. footer styles
--------------------------------------------*/

.footerWrap {
    width: 100%;
    margin: 0 auto;
}


/* ===== 2-1. quicklink ====================================================================== */

.footerQuicklink {
    font-size: 1.4rem;
    padding: 0 6px;
    text-align: center;
}

.footerQuicklink ul li {
    display: inline-block;
    width: 30%;
    background-color: #fafafa;
    border: 1px solid #efefef;
    margin-bottom: 10px;
}
.topQuicklink .footerQuicklink ul li {
    width: 48% !important;
}

.footerQuicklink ul li:nth-of-type(even) {
    clear: right;
}


.footerQuicklink ul li a {
    color: #999;
    display: block;
    padding: 10px 0;
}

.footerQuicklink ul li span {
    padding: 8px 8px 8px 22px;
}

.footerQuicklink ul li.btnHome span {
    background: url(../../../images/v2/common/icon_footer_home.png) left center no-repeat;
    background-size: 20px 20px;
}

.footerQuicklink ul li.btnFlash span {
    background: url(../../../images/v2/common/icon_footer_flash.png) left center no-repeat;
    background-size: 21px 20px;
}

.footerQuicklink ul li.btnRanking span {
    background: url(../../../images/v2/common/icon_footer_ranking.png) left center no-repeat;
    background-size: 21px 20px;
}

.footerQuicklink ul li.btnGenre span {
    background: url(../../../images/v2/common/icon_footer_genre.png) 3px center no-repeat;
    background-size: 16px 20px;
}


/* ===== 2-2. switchView ====================================================================== */

.switchView {
    color: #999;
    font-size: 1.4rem;
    text-align: center;
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
    background-color: #d9d9d9;
}

.switchView li {
    display: inline-block;
    width: 50%;
}

.switchView li a {
    color: #014e94;
    background-color: #efefef;
    display: block;
    padding: 10px;
}

.switchView li span {
    padding: 10px 10px 10px 25px;
}

.switchView li.viewPc span {
    background: url(../../../images/v2/common/icon_footer_viewpc.png) left center no-repeat;
    background-size: 15px 15px;
}

.switchView li.viewSmp span {
    background: url(../../../images/v2/common/icon_footer_viewsmp.png) left center no-repeat;
    background-size: 15px 15px;
}




/* ===== 2-3. footerMainarea ====================================================================== */

.footerMainarea {
    font-size: 1.2rem;
    background-color: #f2f2f2;
}

.footerMainarea ul {
    margin-bottom: 10px;
}

.footerMainarea ul li {
    display: inline-block;
    width: 48%;
}

.footerMainarea ul li:nth-of-type(even) {
    clear: right;
}

.footerMainarea li a {
    display: inline-block;
    color: #666;
    margin: 10px 20px 0 20px;
}

footer li address {
    display: inline;
}


/* ===== 2-4. copyright ====================================================================== */

.footerMainarea .copyrights {
    font-size: 1rem;
    color: #fff;
    background-color: #272727;
    display: block;
    padding: 10px 20px;
}

.footerMainarea .copyrights a {
    color: #fff;
}


/* ===== 2-5. shortcut ====================================================================== */

.shortcut {
    z-index: 10;
    position: fixed;
    right: 15px;
    bottom: 30px;
    display: none;
    width: 30px;
    height: 30px;
    background-color: #333;
    border-radius: 30px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    box-shadow: rgba(255, 255, 255, 0.5) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(255, 255, 255, 0.5) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(255, 255, 255, 0.5) 0px 2px 6px 2px;
}

.shortcut a {
    display: block;
    width: 30px;
    height: 45px;
    text-align: center;
    background: url(../../../images/v2/common/icon_gotop.png) center 6px no-repeat;
    background-size: 16px 16px;
    position: relative;
}

.shortcut a span.label {
    font-size: 0.9rem;
    display: block;
    text-align: center;
    color: #333;
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.5);
    /*
	box-shadow:rgba(255, 255, 255, 0.5) 0px 2px 6px 2px;
	-webkit-box-shadow:rgba(255, 255, 255, 0.5) 0px 2px 6px 2px;
	-moz-box-shadow:rgba(255, 255, 255, 0.5) 0px 2px 6px 2px;
	*/
}

.textshadow .shortcut a span.label {
    background-color: transparent;
    -webkit-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.8), 1px -1px 5px rgba(255, 255, 255, 0.8), -1px -1px 5px rgba(255, 255, 255, 0.8), -1px 1px 5px rgba(255, 255, 255, 0.8), 1px 1px 10px rgba(255, 255, 255, 0.5), 1px -1px 10px rgba(255, 255, 255, 0.5), -1px -1px 10px rgba(255, 255, 255, 0.5), -1px 1px 10px rgba(255, 255, 255, 0.5), 1px 1px 20px rgba(255, 255, 255, 1), 1px -1px 20px rgba(255, 255, 255, 1), -1px -1px 20px rgba(255, 255, 255, 1), -1px 1px 20px rgba(255, 255, 255, 1);
    -moz-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.8), 1px -1px 5px rgba(255, 255, 255, 0.8), -1px -1px 5px rgba(255, 255, 255, 0.8), -1px 1px 5px rgba(255, 255, 255, 0.8), 1px 1px 10px rgba(255, 255, 255, 0.5), 1px -1px 10px rgba(255, 255, 255, 0.5), -1px -1px 10px rgba(255, 255, 255, 0.5), -1px 1px 10px rgba(255, 255, 255, 0.5), 1px 1px 20px rgba(255, 255, 255, 1), 1px -1px 20px rgba(255, 255, 255, 1), -1px -1px 20px rgba(255, 255, 255, 1), -1px 1px 20px rgba(255, 255, 255, 1);
    -o-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.8), 1px -1px 5px rgba(255, 255, 255, 0.8), -1px -1px 5px rgba(255, 255, 255, 0.8), -1px 1px 5px rgba(255, 255, 255, 0.8), 1px 1px 10px rgba(255, 255, 255, 0.5), 1px -1px 10px rgba(255, 255, 255, 0.5), -1px -1px 10px rgba(255, 255, 255, 0.5), -1px 1px 10px rgba(255, 255, 255, 0.5), 1px 1px 20px rgba(255, 255, 255, 1), 1px -1px 20px rgba(255, 255, 255, 1), -1px -1px 20px rgba(255, 255, 255, 1), -1px 1px 20px rgba(255, 255, 255, 1);
    -ms-text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.8), 1px -1px 5px rgba(255, 255, 255, 0.8), -1px -1px 5px rgba(255, 255, 255, 0.8), -1px 1px 5px rgba(255, 255, 255, 0.8), 1px 1px 10px rgba(255, 255, 255, 0.5), 1px -1px 10px rgba(255, 255, 255, 0.5), -1px -1px 10px rgba(255, 255, 255, 0.5), -1px 1px 10px rgba(255, 255, 255, 0.5), 1px 1px 20px rgba(255, 255, 255, 1), 1px -1px 20px rgba(255, 255, 255, 1), -1px -1px 20px rgba(255, 255, 255, 1), -1px 1px 20px rgba(255, 255, 255, 1);
    text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.8), 1px -1px 5px rgba(255, 255, 255, 0.8), -1px -1px 5px rgba(255, 255, 255, 0.8), -1px 1px 5px rgba(255, 255, 255, 0.8), 1px 1px 10px rgba(255, 255, 255, 0.5), 1px -1px 10px rgba(255, 255, 255, 0.5), -1px -1px 10px rgba(255, 255, 255, 0.5), -1px 1px 10px rgba(255, 255, 255, 0.5), 1px 1px 20px rgba(255, 255, 255, 1), 1px -1px 20px rgba(255, 255, 255, 1), -1px -1px 20px rgba(255, 255, 255, 1), -1px 1px 20px rgba(255, 255, 255, 1);
}

body[data-scroll-threshold="false"] .shortcut {
    display: block;
}

.scrollStart .shortcut {
    opacity: 0.4;
    filter: alpha(opacity=40);
}

.scrollStop .shortcut {
    opacity: 0.7;
    filter: alpha(opacity=70);
}


/* --------------------------------------------
4. main module styles
--------------------------------------------*/


/* ===== 3-1-1. top pickup flash(緊急告知枠) ====================================================================== */


/* -- bace */

.modTopflash, .modTopflash02, .modTopflash03, .modTopflash04 {
    text-align: center;
    margin-bottom: 0px;
}

.modTopflash a, .modTopflash02 a, .modTopflash03 a, .modTopflash04 a {
    display: block;
    padding: 2px;
}

.modTopflash p, .modTopflash02 p, .modTopflash03 p, .modTopflash04 p {
    font-size: 16px;
    font-size: 1.6rem;
    border: 1px solid rgba(255, 255, 255, 0.7);
    padding: 5px 25px 5px 5px;
}


/* -- A */

.modTopflash {
    background-color: #272727;
}

.modTopflash a {
    color: #fff;
}

.modTopflash p {
    color: #fff;
    background: url(../../../images/v2/common/icon_list_arrowflash.png) 99% center no-repeat;
    background-size: 20px 20px;
}


/* -- B */

.modTopflash02 {
    background-color: #cce7ff;
}

.modTopflash02 a {
    color: #173b7d;
}

.modTopflash02 p {
    color: #173b7d;
    background: url(../../../images/v2/common/icon_list_arrowflash02.png) 99% center no-repeat;
    background-size: 20px 20px;
}


/* -- C */

.modTopflash03 {
    background-color: #F2F2F2;
}

.modTopflash03 a {
    color: #000;
}

.modTopflash03 p {
    color: #000;
    background: url(../../../images/v2/common/icon_list_arrowflash03.png) 99% center no-repeat;
    background-size: 20px 20px;
}


/* -- D */

.modTopflash04 {
    background-color: #D5000F;
}

.modTopflash04 a {
    color: #fff;
}

.modTopflash04 p {
    color: #fff;
    background: url(../../../images/v2/common/icon_list_arrowflash04.png) 99% center no-repeat;
    background-size: 20px 20px;
}


/* ===== 3-1-2. module site info(サイト告知枠) ====================================================================== */

#modSiteinfo {
    font-size: 1.5rem;
    line-height: 1.2;
    /* border-bottom: 1px solid #efefef;*/
}

#modSiteinfo li {
    font-weight: bold;
    border-bottom: 1px solid #efefef;
}

#modSiteinfo li a {
    display: block;
    min-height: 60px;
    padding: 6px;
}

#modSiteinfo .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

#modSiteinfo .size-thumb1 {
    width: 60px;
    max-height: 60px;
    overflow: hidden;
}

#modSiteinfo li .addition {
    font-size: 1.2rem;
    color: #fff;
    display: block;
    margin: 6px 0;
}

#modSiteinfo li .addition .subtitle {
    background-color: #E61647;
    padding: 0 5px;
    margin-right: 5px;
}


/* ===== 3-2. top news(総合トップ／pickup枠：news+photo) ====================================================================== */

.topMain {margin: 0 auto;}


/* ===== トップニュース(1本目) ===== */
/* clearfix */
.modToppick a:after {
	content: ".";
	clear: both;
	height: 0;
	font-size: 0.1em;
	line-height: 0;
	display: block;
	visibility: hidden;
}

.modToppick article {
    border-top: 1px solid #efefef;
    border-bottom: 1px solid #efefef;
}

.modToppick article a {
    display: block;
    min-height: 60px;
    padding: 6px;
}

.modToppick article .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

.modToppick article .size-thumb1 {
    width: 80px;
    height: 80px;
    overflow: hidden;
    text-align: center;
    border:1px solid #efefef;
    -moz-box-sizing:border-box;
    -webkit-box-sizing: border-box;
    box-sizing:border-box;
    /* center */
    display: flex;
    justify-content: center;
    align-items: center;
}

.modToppick article h1 {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.2;
}

.modToppick article .addition {
    font-size: 1.2rem;
    color: #fff;
    display: block;
    margin: 6px 0;
}

.modToppick article .addition .subtitle {
    background-color: #014e94;
    padding: 2px 5px;
    margin-right: 5px;
    display: inline-block;
    max-width: 200px;
    overflow: hidden;
    line-height: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}


/* ===== ピックアップニュース(2本目以降) ===== */

.modToplist {
    font-size: 16px;
    font-size: 1.6rem;
}

.modToplist li {
    border-bottom: 1px solid #efefef;
    line-height: 1.3;
}

.modToplist li a {
    display: block;
    min-height: 60px;
    padding: 6px;
}

.modToplist .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

.modToplist .size-thumb1 {
    width: 80px;
    height: 80px;
    overflow: hidden;
    text-align: center;
    border:1px solid #efefef;
    -moz-box-sizing:border-box;
    -webkit-box-sizing: border-box;
    box-sizing:border-box;
    /* center */
    display: flex;
    justify-content: center;
    align-items: center;
}

.modToplist li .addition {
    font-size: 1.2rem;
    color: #fff;
    display: block;
    margin: 6px 0;
}

.modToplist li .addition .subtitle {
    background-color: #014e94;
    padding: 2px 5px;
    margin-right: 5px;
    display: inline-block;
    max-width: 200px;
    overflow: hidden;
    line-height: 1;
    white-space: nowrap;
    text-overflow: ellipsis;
    -webkit-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}


/* loading for listUpdater.js */


/*
.js .modToplist .now-loading {
	background-image: url(../../../images/v2/common/loading.gif);
	background-position: center center;
	background-repeat: no-repeat;
	display: none;
	height: 60px;
}

.js .modToplist .now-loading.active {
	display: block;
}

*/

#moreApp {
    display: block;
    font-weight: bold;
    border-bottom: 1px solid #efefef;
}

#moreApp a {
    display: block;
    min-height: 60px;
    padding: 6px;
}

#moreApp .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

#moreApp img {
    margin: 0 auto;
    width: 320px;
}


/*
.modToplist .more {
	display: block;
	margin: 0;
	vertical-align: middle;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-bottom: 1px solid #efefef;
}

.modToplist .more a,
.modToplist .more span {
	float: right;
	margin: 10px;
	color: #fff;
	font-size: 1.5rem;
	line-height: 35px;
	display: block;
	padding: 0 10px;
	background-image: none;
	background-color: #0066cc;
}
*/


/* ===== クイックリンク ===== */

.topQuicklink {
    border-bottom: 1px solid #efefef;
    padding: 10px 0 0;
}


/* ===== 3-3. mod editors pickup ====================================================================== */

#modPickup {
    font-size: 16px;
    font-size: 1.6rem;
}

#modPickup ul {
    margin: 0;
}

.more-part #modPickup ul {
    margin: 20px 0 0 0;
    border-top: 1px solid #efefef;
}

#modPickup li {
    border-bottom: 1px solid #efefef;
    display: block;
    margin: 0;
    line-height: 1.2;
}

#modPickup li a {
    text-align: left;
    display: block;
    min-height: 80px;
    padding: 6px;
    height: auto;
    width: auto;
    border: none;
}

#modPickup .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

#modPickup .photo.size-thumb1 {
    width: 80px;
    max-height: 80px;
    overflow: hidden;
}

#modPickup .photo img {
    height: auto;
    margin: 0;
}

#modPickup li .addition {
    font-size: 1.2rem;
    color: #666;
    display: block;
    padding-top: 2px;
}


/* loading for listUpdater.js */


/*
.js #modPickup .now-loading {
	background-image: url(../../../images/v2/common/loading.gif);
	background-position: center center;
	background-repeat: no-repeat;
	display: none;
	height: 60px;
}

.js #modPickup .now-loading.active {
	display: block;
}
*/


/* ===== 3-4. mod premium ====================================================================== */

#modPremium {
    font-size: 16px;
        font-size: 1.6rem;
    line-height: 1.2;
    margin: 15px auto 30px;
    border-top: 1px solid #014e94;
    position: relative;
}

#modPremium h1 {
    font-size: 1.6rem;
    font-weight: bold;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

#modPremium ul {
    margin-top: 15px;
}

#modPremium li {
    border-bottom: 1px solid #efefef;
}

#modPremium li a {
    display: block;
    min-height: 80px;
    padding: 6px;
}

#modPremium .photo {
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}

#modPremium .photo.size-thumb1 {
    width: 80px;
    height: 80px;
    overflow: hidden;
    text-align: center;
    border:1px solid #efefef;
    -moz-box-sizing:border-box;
    -webkit-box-sizing: border-box;
    box-sizing:border-box;
    /* center */
    display: flex;
    justify-content: center;
    align-items: center;
}

#modPremium li .addition {
    font-size: 1.2rem;
    color: #fff;
    display: block;
    margin: 6px 0;
}

#modPremium li .addition .subtitle {
    background-color: #014e94;
    padding: 2px 5px;
    margin-right: 5px;
}


/* loading for listUpdater.js */


/*
.js #modPremium .now-loading {
	background-image: url(../../../images/v2/common/loading.gif);
	background-position: center center;
	background-repeat: no-repeat;
	display: none;
	height: 80px;
}

.js #modPremium .now-loading.active {
	display: block;
}
*/


/* ===== 3-5. mod dailynews ====================================================================== */

#modTopisblock, #modDailynews {
    margin: 15px auto 30px;
    border-top: 1px solid #014e94;
    position: relative;
}

#modTopisblock h1, #modDailynews h1 {
    font-size: 1.6rem;
    font-weight: bold;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

#modTopisblock h2, #modDailynews h2 {
    font-size: 1.3rem;
    margin: 15px 15px 10px;
    color: #666;
}

#modTopisblock ul.today, #modDailynews ul.today {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.2;
    margin-top: 15px;
}

#modTopisblock ul.today li, #modDailynews ul.today li {
    border-bottom: 1px solid #efefef;
    min-height: 30px;
    vertical-align: middle;
}

#modTopisblock ul.today li a, #modDailynews ul.today li a {
    display: block;
    padding: 6px 15px;
}

#modTopisblock ul.feature, #modDailynews ul.feature {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.2;
    margin: 20px 0 0 15px;
}

#modTopisblock ul.feature li, #modDailynews ul.feature li {
    border: 1px solid #ccc;
    margin: 0 10px 10px 0;
    min-height: 44px;
}
/* landscape */
@media screen and (min-width: 480px) {
#modTopisblock ul.feature li, #modDailynews ul.feature li {
    display: inline-block;
    width: 47%;
    float: left;
    height: 70px;
}
}
/* landscape */

#modTopisblock ul.feature li a, #modDailynews ul.feature li a {
    color: #333;
    display: block;
    padding: 6px;
    min-height: 44px;
    -moz-box-sizing:border-box;
    -webkit-box-sizing: border-box;
    box-sizing:border-box;
}
#modTopisblock ul.feature a .size-thumb1{
	width:60px;
	height: 60px;
	text-align: center;
	background: #efefef;
}
#modTopisblock ul.feature li.featureNetshop, #modDailynews ul.feature li.featureNetshop {
    border: 1px solid #000;
    background: url(../../../images/v2/common/icon_content_netshop.png) 50% 50% no-repeat;
    background-size: auto 20px;
    display: inline-block;
}
#modTopisblock ul.feature li.featureNetshop a, #modDailynews ul.feature li.featureNetshop a {
    padding: 6px!important;
}

#modTopisblock ul.feature li.featureSonae a, #modTopisblock ul.feature li.featureNetshop a, #modDailynews ul.feature li.featureSonae a, #modDailynews ul.feature li.featureNetshop a {
    opacity: 0;
    filter: alpha(opacity=0);
}

/* clearfix */
#modTopisblock ul.feature li:after {
	content: ".";
	clear: both;
	height: 0;
	font-size: 0.1em;
	line-height: 0;
	display: block;
	visibility: hidden;
}


/* ===== 3-6. mod smp recommend ====================================================================== */

#modSmprecommend {
    margin: 15px auto;
}

#modSmprecommend h1 {
    font-size: 1.2rem;
    color: #666;
}

#modSmprecommend h1 span.title {
    color: #fff;
    background-color: #ff6666;
    padding: 5px 12px;
    margin-right: 15px;
}

#modSmprecommend h2 {
    font-size: 1.3rem;
    margin: 15px 15px 10px;
    color: #666;
}

#modSmprecommend ul {
    font-size: 1.4rem;
    line-height: 1.2;
    margin-top: 15px;
}

#modSmprecommend ul li {
    font-weight: bold;
    min-height: 30px;
    vertical-align: middle;
}

#modSmprecommend ul li a {
    display: block;
    padding: 6px 15px;
}


/* ===== 3-7. mod iRONNA ====================================================================== */

#modDiscussion {
    margin: 20px auto;
    border-top: 1px solid #e92a00;
    position: relative;
}

#modDiscussion h1 {
    position: absolute;
    top: -18px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    display: block;
    width: 82px;
    height: 20px;
    background-color: #fff;
}

#modDiscussion h1 a {
    display: block;
    width: 82px;
    height: 20px;
    background: url(../../../images/v2/common/icon_content_ironna.png) #fff left top no-repeat;
    background-size: 82px 20px;
}

#modDiscussion ul {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.2;
    margin-top: 15px;
}

#modDiscussion li {
    border-bottom: 1px solid #efefef;
    min-height: 30px;
    vertical-align: middle;
}

#modDiscussion li a {
    display: block;
    padding: 6px 15px;
}


/* ===== 3-8. mod sankeiphoto ====================================================================== */

#modPhotos {
    margin: 20px auto 30px;
    border-top: 1px solid #2a2a2a;
    position: relative;
}

#modPhotos h1 {
    position: absolute;
    top: -18px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

#modPhotos h1 a {
    display: block;
    width: 110px;
    height: 20px;
    background: url(../../../images/v2/common/icon_content_sankeiphoto.png) 50% 50% no-repeat;
    background-size: auto 20px;
}

#modPhotos .photoframe {
    text-align: center;
    vertical-align: middle;
    margin: 20px 15px 10px;
    border: 1px solid #efefef;
    max-height: 200px;
    overflow: hidden;
}

#modPhotos .photoframe img {
    max-height: 200px;
}

#modPhotos p {
    font-size: 1.2rem;
    padding: 0 15px 10px;
    line-height: 1.2;
    border-bottom: 1px solid #efefef;
}


/* ===== 3-9. mod fb+sns follow me ====================================================================== */

#fbFollow {
    border-bottom: 1px solid #efefef;
}

#fbFollow h1,#snsFollow h1 {
    font-size: 1.5rem;
    color: #333;
    margin: 0;
    padding: 10px;
    position: static;
    top: 0;
}

#fbFollow div {
    padding: 0 10px 10px;
    display: inline-block;
    word-break: break-all;
}
#snsFollow {
	margin: 0 0 10px;
	display:block;
      border-bottom: 1px solid #efefef;
}
#snsFollow iframe {margin: 0;}
#snsFollow ul{margin-top: 0px;margin-bottom: 10px;}
#snsFollow ul li a{padding:0;}
#snsFollow ul li{
	display:inline-block;
	padding-left: 10px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border: none;
}
#snsFollow ul li span{
	display:block;
	margin:0;
	vertical-align:middle;
  font-size: 12px;
}
#snsFollow ul li.tw {height: 20px;}
#snsFollow ul li.fb {height: 20px;}
#snsFollow ul li.line {height: 20px;}
#snsFollow ul li.push {height: 20px;}
#snsFollow ul li.fb span {text-align:left;}
.device-ios #snsFollow .push{display: none;}


/*-- 記事下SNSボタン群 */
.device-ios div.socialbtnSet #PushLink {display: none;}
.socialbtnSet {margin: 0 5px 10px;}
.socialbtnSet iframe{vertical-align: bottom;}
.socialbtnSet .twList,.socialbtnSet .fb-like,.socialbtnSet .fb-share-button,.socialbtnSet .line-it-button{margin-right: 10px;}
@media screen and (min-width: 425px) {
.socialbtnSet .line-it-button{margin-top: 0;}
}
@media screen and (max-width: 424px) {
.socialbtnSet .line-it-button{padding-top: 10px;height: 22px!important;}
}
/* ===== 3-10. mod ranking ====================================================================== */

#modRanking {
    padding-bottom: 5px;
}


/* --- タイトル */

#modRanking h1 {
    background: linear-gradient(to bottom, #f06082 0%, #e43961 100%) repeat scroll 0 0 #e43961;
    border-bottom: 1px solid #f05f81;
    border-top: 1px solid #fac6d2;
    box-shadow: 0 3px 3px #555;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1.2;
    padding: 5px 10px;
    text-align: left;
    text-shadow: 0 -1px 1px #666;
}

.lt-ie7 #modRanking h1 {
    height: 1px;
    overflow: visible;
}

#modRanking h1 a {
    color: #FFF;
}


/* --- タイトルナビ(ウィジェット・コンテンツ共通) */

#modRanking .linkTo {
    text-align: center;
    margin: 5px auto 0;
    border: none;
}

#modRanking .linkTo:after {
    content: ".";
    clear: both;
    height: 0;
    font-size: 0.1em;
    line-height: 0;
    display: block;
    visibility: hidden;
}

#modRanking .linkTo {
    font-size: 1.3rem;
    margin-top: 15px;
    color: #fff;
    border-bottom: 3px solid #89b1d7;
}

#modRanking .linkTo span a {
    padding: 5px 0;
    display: inline-block;
    vertical-align: middle;
    color: #fff;
    width: 46%;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

#modRanking .linkTo span .selected {
    font-size: 1.5rem;
    padding: 8px 0 5px;
    width: 52%;
    margin-top: -5px;
    color: #fff;
    background-color: #89b1d7;
    border-right: 3px solid #fff;
    border-left: 3px solid #fff;
}

#modRanking .linkTo a.unselected {
    background-color: #acd0f3;
}


/* --- ランキング出力部(共通) */

#modRanking ol.rankingLists {
    font-size: 16px;
    font-size: 1.6rem;
    border-top: 1px solid #efefef;
}

#modRanking ol.rankingLists li {
    width: 100%;
    height: 80px !important;
    border-bottom: 1px solid #efefef;
}

.lt-ie7 #modRanking ol.rankingLists li {
    height: 1px;
    overflow: visible;
}

#modRanking ol.rankingLists li a {
    display: block;
    min-height: 2.8em;
    padding: 6px;
}

#modRanking ol.rankingLists li a .rank-image, #modRanking ol.rankingLists li a .title {
    height: 45px;
    overflow: hidden;
}

#modRanking ol.rankingLists li a .rank-image {
    display: table-cell;
    vertical-align: top;
    color: transparent;
    width: 40px;
    background: url(../../../images/v2/common/fallback/ranking_none.png) 50% 50% no-repeat;
}

#modRanking ol.rankingLists li a .title {
    display: table-cell;
    padding-left: 5px;
}

#modRanking ol.rankingLists li a .rank {
    display: table-cell;
    vertical-align: top;
    text-align: center;
    width: 3em;
    font-weight: bold;
    color: #a9a9a9;
}

.backgroundsize #modRanking ol.rankingLists li a .rank-image {
    background: url(../../../images/v2/common/ranking_none.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank1, #modRanking ol.rankingLists li a .rank01 {
    background: url(../../../images/v2/common/fallback/ranking_001.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank1, .backgroundsize #modRanking ol.rankingLists li a .rank01 {
    background: url(../../../images/v2/common/ranking_001.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank2, #modRanking ol.rankingLists li a .rank02 {
    background: url(../../../images/v2/common/fallback/ranking_002.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank2, .backgroundsize #modRanking ol.rankingLists li a .rank02 {
    background: url(../../../images/v2/common/ranking_002.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank3, #modRanking ol.rankingLists li a .rank03 {
    background: url(../../../images/v2/common/fallback/ranking_003.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank3, .backgroundsize #modRanking ol.rankingLists li a .rank03 {
    background: url(../../../images/v2/common/ranking_003.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank4, #modRanking ol.rankingLists li a .rank04 {
    background: url(../../../images/v2/common/fallback/ranking_004.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank4, .backgroundsize #modRanking ol.rankingLists li a .rank04 {
    background: url(../../../images/v2/common/ranking_004.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank5, #modRanking ol.rankingLists li a .rank05 {
    background: url(../../../images/v2/common/fallback/ranking_005.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank5, .backgroundsize #modRanking ol.rankingLists li a .rank05 {
    background: url(../../../images/v2/common/ranking_005.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank6, #modRanking ol.rankingLists li a .rank06 {
    background: url(../../../images/v2/common/fallback/ranking_006.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank6, .backgroundsize #modRanking ol.rankingLists li a .rank06 {
    background: url(../../../images/v2/common/ranking_006.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank7, #modRanking ol.rankingLists li a .rank07 {
    background: url(../../../images/v2/common/fallback/ranking_007.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank7, .backgroundsize #modRanking ol.rankingLists li a .rank07 {
    background: url(../../../images/v2/common/ranking_007.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank8, #modRanking ol.rankingLists li a .rank08 {
    background: url(../../../images/v2/common/fallback/ranking_008.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank8, .backgroundsize #modRanking ol.rankingLists li a .rank08 {
    background: url(../../../images/v2/common/ranking_008.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank9, #modRanking ol.rankingLists li a .rank09 {
    background: url(../../../images/v2/common/fallback/ranking_009.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank9, .backgroundsize #modRanking ol.rankingLists li a .rank09 {
    background: url(../../../images/v2/common/ranking_009.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank10 {
    background: url(../../../images/v2/common/fallback/ranking_010.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank10 {
    background: url(../../../images/v2/common/ranking_010.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank11 {
    background: url(../../../images/v2/common/fallback/ranking_011.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank11 {
    background: url(../../../images/v2/common/ranking_011.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank12 {
    background: url(../../../images/v2/common/fallback/ranking_012.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank12 {
    background: url(../../../images/v2/common/ranking_012.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank13 {
    background: url(../../../images/v2/common/fallback/ranking_013.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank13 {
    background: url(../../../images/v2/common/ranking_013.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank14 {
    background: url(../../../images/v2/common/fallback/ranking_014.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank14 {
    background: url(../../../images/v2/common/ranking_014.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank15 {
    background: url(../../../images/v2/common/fallback/ranking_015.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank15 {
    background: url(../../../images/v2/common/ranking_015.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank16 {
    background: url(../../../images/v2/common/fallback/ranking_016.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank16 {
    background: url(../../../images/v2/common/ranking_016.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank17 {
    background: url(../../../images/v2/common/fallback/ranking_017.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank17 {
    background: url(../../../images/v2/common/ranking_017.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank18 {
    background: url(../../../images/v2/common/fallback/ranking_018.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank18 {
    background: url(../../../images/v2/common/ranking_018.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank19 {
    background: url(../../../images/v2/common/fallback/ranking_019.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank19 {
    background: url(../../../images/v2/common/ranking_019.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank20 {
    background: url(../../../images/v2/common/fallback/ranking_020.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank20 {
    background: url(../../../images/v2/common/ranking_020.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank21 {
    background: url(../../../images/v2/common/fallback/ranking_021.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank21 {
    background: url(../../../images/v2/common/ranking_021.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank22 {
    background: url(../../../images/v2/common/fallback/ranking_022.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank22 {
    background: url(../../../images/v2/common/ranking_022.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank23 {
    background: url(../../../images/v2/common/fallback/ranking_023.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank23 {
    background: url(../../../images/v2/common/ranking_023.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank24 {
    background: url(../../../images/v2/common/fallback/ranking_024.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank24 {
    background: url(../../../images/v2/common/ranking_024.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank25 {
    background: url(../../../images/v2/common/fallback/ranking_025.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank25 {
    background: url(../../../images/v2/common/ranking_025.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank26 {
    background: url(../../../images/v2/common/fallback/ranking_026.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank26 {
    background: url(../../../images/v2/common/ranking_026.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank27 {
    background: url(../../../images/v2/common/fallback/ranking_027.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank27 {
    background: url(../../../images/v2/common/ranking_027.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank28 {
    background: url(../../../images/v2/common/fallback/ranking_028.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank28 {
    background: url(../../../images/v2/common/ranking_028.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank29 {
    background: url(../../../images/v2/common/fallback/ranking_029.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank29 {
    background: url(../../../images/v2/common/ranking_029.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}

#modRanking ol.rankingLists li a .rank30 {
    background: url(../../../images/v2/common/fallback/ranking_030.png) 50% 50% no-repeat;
}

.backgroundsize #modRanking ol.rankingLists li a .rank30 {
    background: url(../../../images/v2/common/ranking_030.png) 50% 50% no-repeat;
    background-size: 26px 21px;
}


/* --- ランキング出力部(chartbeat) */

#modRanking .cb-rank-wrapper ol.rankingLists li a .status {
    display: block;
    margin-top: 5px;
    height: 14px;
    color: transparent;
    text-align: right;
}

#modRanking .cb-rank-wrapper ol.rankingLists li a .rank-up {
    background: url(../../../images/v2/common/fallback/rank_up.png) 50px 50% no-repeat;
}

#modRanking .cb-rank-wrapper ol.rankingLists li a .rank-up {
    background: url(../../../images/v2/common/rank_up.png) 50px 50% / 27px 10px no-repeat;
}

#modRanking .cb-rank-wrapper ol.rankingLists li a .rank-down {
    background: url(../../../images/v2/common/fallback/rank_down.png) 50px 50% no-repeat;
}

#modRanking .cb-rank-wrapper ol.rankingLists li a .rank-down {
    background: url(../../../images/v2/common/rank_down.png) 50px 50% / 47px 10px no-repeat;
}

#modRanking .cb-rank-wrapper ol.rankingLists li a .rank-flat {
    background: url(../../../images/v2/common/fallback/rank_flat.png) 50px 50% no-repeat;
}

#modRanking .cb-rank-wrapper ol.rankingLists li a .rank-flat {
    background: url(../../../images/v2/common/rank_flat.png) 50px 50% / 12px 10px no-repeat;
}

.lt-ie7 #modRanking .cb-rank-wrapper ol.rankingLists li a .rank-up, .lt-ie7 #modRanking .cb-rank-wrapper ol.rankingLists li a .rank-down, .lt-ie7 #modRanking .cb-rank-wrapper ol.rankingLists li a .rank-flat {
    background: none;
}

#modRanking .cb-rank-viewport {
    width: 100%;
    overflow: hidden;
    position: relative;
}

#modRanking .cb-rank-viewport .cb-rank-wrapper {
    width: 100%;
    position: relative;
    z-index: 1;
}

#modRanking .cb-rank-viewport .cb-rank-wrapper ol {
    position: relative;
    width: 100%;
}

#modRanking .cb-rank-viewport .cb-rank-wrapper ol.now-loading {
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center 20%;
    background-repeat: no-repeat;
}

#modRanking .cb-rank-viewport .cb-rank-wrapper ol li.cb-rank-entry {
    position: absolute;
    left: 0;
    overflow: hidden;
    background-color: #fff;
}

#modRanking .cb-rank-viewport .cb-rank-wrapper ol.now-loading li {
    opacity: 0.3;
}

#modRanking .cb-rank-viewport .cb-rank-wrapper ol.cb-active li.cb-rank-entry {
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 350ms linear;
    -moz-transition: all 350ms linear;
    -o-transition: all 350ms linear;
    -ms-transition: all 350ms linear;
    transition: all 350ms linear;
}

#modRanking .cb-rank-viewport .cb-rank-cover {
    height: 10px;
    width: 100%;
    opacity: 0.3;
    position: relative;
    z-index: 2;
}

.cssgradients #modRanking .cb-rank-viewport .cb-rank-cover {
    opacity: 1;
}


/* --- ランキング出力部(ソーシャルランキング) */

#modRanking ol.soc-rank li a dl.status {
    color: #333333;
    font-size: 1.2rem;
    height: 16px;
    margin-top: 5px;
    padding-left: 45px;
    padding-right: 10px;
    vertical-align: middle;
    display: block;
    text-align: right;
}

#modRanking ol.soc-rank li a dl.status dt {
    display: inline-block;
    text-align: right;
}

#modRanking ol.soc-rank li a dl.status dd.tw {
    display: inline-block;
    font-weight: bold;
    text-align: right;
    min-width: 50px;
}

#modRanking ol.soc-rank li a dl.status dd.fb {
    display: inline-block;
    font-weight: bold;
    text-align: right;
    min-width: 40px;
}

#modRanking ol.soc-rank li a .tw {
    background: url("../../../images/v2/common/soc_twcount.png") no-repeat scroll 0 50% rgba(0, 0, 0, 0);
    background-size: 15px 12px;
    margin-right: 15px;
    padding: 4px 5px 2px 0;
}

.backgroundsize #modRanking ol.soc-rank li a .tw {
    background: url("../../../images/v2/common/soc_twcount.png") no-repeat scroll 0 50%;
    background-size: 15px 12px;
}

#modRanking ol.soc-rank li a .fb {
    background: url("../../../images/v2/common/soc_fbcount.png") no-repeat scroll 0 50% rgba(0, 0, 0, 0);
    background-size: 6px 12px;
    padding: 4px 5px 2px 0;
}

.backgroundsize #modRanking ol.soc-rank li a .fb {
    background: url("../../../images/v2/common/soc_fbcount.png") no-repeat scroll 0 50%;
    background-size: 6px 12px;
}


/* ===== 3-11. mod quicklink ====================================================================== */

.modQuicklink {
    font-size: 1rem;
    padding: 0 6px;
    text-align: center;
}

.modQuicklink ul li {
    display: inline-block;
    width: 30%;
    background-color: #fafafa;
    border: 1px solid #014e94;
    margin-bottom: 10px;
}

.modQuicklink ul li a {
    color: #014e94;
    display: block;
    padding: 25px 0 5px;
}

.modQuicklink ul li span {
    padding: 20px 0 0;
}

.modQuicklink ul li.btnHome span {
    background: url(../../../images/v2/common/icon_contents_home.png) top center no-repeat;
    background-size: 21px 20px;
}

.modQuicklink ul li.btnFlash span {
    background: url(../../../images/v2/common/icon_contents_flash.png) top center no-repeat;
    background-size: 21px 20px;
}

.modQuicklink ul li.btnRanking span {
    background: url(../../../images/v2/common/icon_contents_ranking.png) top center no-repeat;
    background-size: 21px 20px;
}


/* ===== 3-12. mod GQ JAPAN + Wired ====================================================================== */

#modGqjapan, #modWired {
    font-size: 16px;
        font-size: 1.6rem;
    line-height: 1.2;
    margin: 15px auto 30px;
    border-top: 1px solid #014e94;
    position: relative;
}

#modGqjapan h1, #modWired h1 {
    font-size: 1.6rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
    font-weight: bold;
}

#modGqjapan ul, #modWired ul {
    margin-top: 15px;
}

#modGqjapan li, #modWired li {
	line-height: 1.2;
}

#modGqjapan li a, #modWired li a {
    display: block;
    min-height: 60px;
    padding: 6px;
}

#modGqjapan .photo, #modWired .photo {
    background: #efefef;
    display: block;
    font-size: 0;
    float: left;
    margin: 0 6px 0 0;
    line-height: 0;
    overflow: hidden;
    width: 60px;
    height: 60px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#modGqjapan .photo.size-thumb1 img, #modWired .photo.size-thumb1 img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}

#modGqjapan li .addition, #modWired li .addition {
    font-size: 1.2rem;
    color: #fff;
    display: block;
    margin: 6px 0;
}

#modGqjapan li .addition .subtitle, #modWired li .addition .subtitle {
    background-color: #89b1d7;
    padding: 0 5px;
    margin-right: 5px;
}


/* ===== 3-13. module QA ====================================================================== */
#modQAanswer{
    border: 1px solid #efefef;
    padding: 20px 0 15px;
    margin-bottom: 25px;
}
#modQAanswer .title{
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	color: #333;
	margin: 0 15px 10px;
	color: #D7000F;
}
/* logo-oshiete */
.logo-oshiete{text-align: right; margin-bottom: 15px;}
.logo-oshiete img{width: 180px;}

/* /logo-oshiete */

#modQAanswer .linkTo{border: none;}
#modQAanswer .linkTo a{
	font-size: 14px;
	font-size: 1.4rem;
	font-weight:  bold;
	display: inline-block;
	width: 100%;
	padding: 15px 0;
	border: 1px solid #efefef;
	text-align: center;
	color: #fff;
	float: left;
	margin-bottom: 10px;
	border-radius:4px;
box-sizing: border-box;
}
#modQAanswer .linkTo a.comBtn{background: #D7000F;}
#modQAanswer .linkTo a.morelistBtn{background: #111;}
#modQAanswer .a_article_wrap {
	margin: 0 15px;}

#modQAanswer .a_article{
	width: 100%;
	margin: 15px auto;
}
#modQAanswer .a_article .user_area {
  width: 70px;
  padding: 0 15px 0 0;
  display: table-cell;
  vertical-align: top; }
 #modQAanswer .a_article .user_area img {
    height: 50px;
    display: block;
    margin: 0 auto; }

#modQAanswer .a_article .a_article_right {
  width: 100%;
  display: table-cell;
  vertical-align: top;
  border: 2px solid #ddd;
  border-radius: 5px;
  position: relative;
  padding: 10px;
  background: #fff;
  }
  #modQAanswer .a_article .a_article_right:before {
    content: "";
    display: block;
    background: url(../../../../../images/v2/pc/sankei/fukidashi_arrow_white.png) no-repeat left top;
    width: 18px;
    height: 12px;
    position: absolute;
    top: 25px;
    left: -18px; }

#modQAanswer .a_article_info {
  padding-bottom: 13px; }
  #modQAanswer .a_article_info .a-title_item ul {
    height: 20px;
    line-height: 20px; }
    #modQAanswer .a_article_info .a-title_item ul li {
      float: left; }
  #modQAanswer .a_article_info .author {
    border-left: #D7000F solid 8px;
    margin: 0 16px 0 0;
    padding-left: 6px;
      font-size: 14px;
      font-weight: bold;
    }
    #modQAanswer .a_article_info .author a {
      color: #3366cc;
      font-size: 14px;
      font-weight: bold; }
      #modQAanswer .a_article_info .author a:hover {
        text-decoration: underline; }
  #modQAanswer .a_article_info .date {
    color: #999;
    font-size: 12px; }

#modQAanswer .a_text {
  font-size: 14px;
  font-size: 1.4rem;
  line-height: 1.4;
}
#modQAanswer .a_text h2 {display: inline; }
#modQAanswer .a_complain{
	font-size: 15px;
	font-size: 1.5rem;
	margin-top:5px;
	text-align: right;
}

/* コメントなし */
#modQAanswer .noCommentArea{
	font-size: 15px;
	font-size: 1.5rem;
	border: 2px solid #ddd;
	text-align: center;
	padding: 50px 10px;
	margin-bottom: 15px;
	border-radius:4px;
}


/* ===== 3-14. module photo gallery ====================================================================== */
.photoGallery {
	width: 100%;
	overflow: hidden;
	margin: 0;
	/* padding:0 0 8px ; */
	border-bottom: 1px solid rgb(224, 224, 224);
	box-sizing: border-box;
	position: relative;
}
.photoGallery li{
border: none! important;
}

.photoGallery h1 {
	font-size: 15px;
	font-size: 1.5rem;
	text-align: center;
	font-weight: bold;
	padding: 8px;
	margin-bottom: 8px;
	color: #fff;
}

.photoGallery .swiper-container {
	width: 100%;
	overflow: hidden;
}

.photoGallery .swiper-container .swiper-slide {
	display: inline-block;
}

.photoGallery .swiper-container .swiper-slide a {
	margin: 0 0 0 10px;
	box-sizing: content-box;
	display: block;
	text-align: center;
}

.photoGallery .navigation .prev,
.photoGallery .navigation .next {
	height: 30px;
	width: 30px;
	position: absolute;
	z-index: 9999;
	color: #111;
}
.photoGallery .navigation .prev {
	line-height: 2em;
	font-weight: bold;
	font-size: 0;
	background-size: 20px;
	border-radius: 4px;
}
.photoGallery .navigation .next {
	line-height: 2em;
	font-weight: bold;
	font-size: 0;
	background: url(../../../images/v2/common/arrow_next_black.png) 50% 50% no-repeat;
	background-size: 20px;
	border-radius: 4px;
}


/* top */
.photoGallery.top {background: #555;}
.photoGallery.top h1  {background: #666666;color: #fff;}

.photoGallery.top .swiper-container {
	height: 100px;
	margin:0 0 10px 0;
}

.photoGallery.top .swiper-container .swiper-slide a {
	width: 100px;
	height: 100px;
	background: #444;
}

.photoGallery.top .swiper-container .swiper-slide img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}
.photoGallery.top .navigation .prev {top: 80px;left: 0;
	background: url(../../../images/v2/common/arrow_prev_white.png) 50% 50% no-repeat;background-size: 20px;}
.photoGallery.top .navigation .next {top: 80px;right: 0;
	background: url(../../../images/v2/common/arrow_next_white.png) 50% 50% no-repeat;background-size: 20px;}

/* article */

.photoGallery.detail{margin:0 0 10px 0 ; padding:10px 0;}
.photoGallery.detail li{}
.photoGallery.detail {border-top: 1px solid rgb(224, 224, 224);}
.photoGallery.detail .swiper-container {height: 80px;}

.photoGallery.detail .swiper-container .swiper-slide a {
	width: 80px;
	height: 80px;
	margin:0 0 0 10px;
	border: 1px solid #cccccc;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing: border-box;
}

.photoGallery.detail .swiper-container .swiper-slide img {
	width: auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}

.photoGallery.detail .navigation .prev {top: 40px ;left: 0px;background: url(../../../images/v2/common/arrow_prev_black.png) 50% 50% no-repeat;background-size: 20px;}
.photoGallery.detail .navigation .next {top: 40px ;right: 0px;	background: url(../../../images/v2/common/arrow_next_black.png) 50% 50% no-repeat;background-size: 20px;}



/* ===== 3-15. module travel sns ====================================================================== */
.modTravelsns{
      margin: 10px auto 15px;
      padding: 10px;
      display: block;
      background-color: #fff;
      border: 1px solid #e6e6e6;
      width: 320px;

}
.modTravelsns .snsTravel_fb {
    float: left;
    margin-right: 12px;
}

.modTravelsns .snsBtnWrap {
  display: table;
  table-layout: fixed;
  text-align: center;
  width: 100%;
    padding-top: 10px;
}
.modTravelsns .snsBtnWrap li {
  display: table-cell;
  vertical-align: middle;
}
.modTravelsns .snsBtnWrap a {
  display: block;
    color: #fff;
    font-weight: 400;
    text-decoration: none;
    height: 40px;
    text-align: center;
    line-height: 40px;
    font-size: 1.4rem;
}
.modTravelsns .snsBtnWrap a.fb {
    background: url(/apr_news/images/v1/common/icon_fb.png) #3B5998 8px center no-repeat;
    background-size: 20px;
}
.modTravelsns .snsBtnWrap a.tw {
    background: url(/apr_news/images/v1/common/icon_tw.png) #00aced 8px center no-repeat;
    background-size: 20px;
    margin-left: 10px;
}




/* --------------------------------------------
4. index styles
--------------------------------------------*/

.indexMain {
    margin: 0 auto 30px;
}


/* ===== 4-1. index text ====================================================================== */

.indexText {
    line-height: 1.2;
    margin: 15px auto 30px;
    border-top: 1px solid #014e94;
    position: relative;
}

.indexText h1 {
    font-size: 16px;
    font-size: 1.6rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
    font-weight: bold;
}

.indexText ul {
    font-size: 1.6rem;
}
.indexText ul:first-child,
.indexText h1+ul{
    margin-top: 15px;
}


.indexText li {
    line-height: 1.2;
    border-bottom: 1px solid #efefef;
}

.indexText li a {
    display: block;
    min-height: 80px;
    padding: 6px;
}
/*
.indexText li a img {
    height: 15px;
    margin: 0 0 0 5px;
}
*/

.indexText li .addition {
    font-size: 12px;
    font-size: 1.2rem;
    color: #666;
    display: block;
    margin-bottom: 4px;
}
.indexText li .addition .subtitle {
    background-color: #efefef;
    padding: 2px;
    display: inline-block;
}

.indexText li .addition time {
    display: inline-block;
    margin-bottom: 0;
}

.indexText .more, .indexText .nextBtn, .indexText .prevBtn {
    font-size: 1.4rem;
    line-height: 1.4;
    display: block;
    margin: 15px;
    text-align: center;
    border: 1px solid #efefef;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
}

.indexText .more a, .indexText .more span, .indexText .nextBtn a, .indexText .nextBtn span, .indexText .prevBtn a, .indexText .prevBtn span {
    display: block;
    padding: 10px;
    vertical-align: middle;
    background: none;
}

.indexText .photo{
    display: block;
    float: right;
    margin: 0 0 0 10px;
    font-size: 0;
    line-height: 0;
    text-align: center;
    border:1px solid #efefef;
    -moz-box-sizing:border-box;
    -webkit-box-sizing: border-box;
    box-sizing:border-box;
}
.indexText .size-thumb1 {
    width: 80px;
    height: 80px;
    overflow: hidden;
	text-align: center;
    /* center */
    display: flex;
    justify-content: center;
    align-items: center;
	}
.indexText .size-thumb1 img{
    width: auto;
	height: auto;
    max-width: 100%;
    max-height: 100%;
}

/* ===== 4-1-1. index text tabstyle ====================================================================== */

.titleTabstyle {
    font-size: 1.3rem;
    margin-top: 15px;
    color: #fff;
    border-bottom: 3px solid #89b1d7;
    background-color: #acd0f3;
}

.titleTabstyle li {
    padding: 5px 0;
    display: inline-block;
    vertical-align: middle;
    width: 46%;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.titleTabstyle li.selected {
    font-size: 1.5rem;
    padding: 8px 0 5px;
    width: 52%;
    margin-top: -5px;
    color: #fff;
    background-color: #89b1d7;
    border-right: 3px solid #fff;
}

.titleTabstyle a {
    color: #fff;
    display: block;
}

.indexText.tabstyle {
    font-size: 1.4rem;
    line-height: 1.2;
    margin: 0 auto;
    border-top: none;
    position: static;
}

.indexText.tabstyle ul {
    margin-top: 0;
    border-top: none;
}


/* ===== 4-1-2. index text listUpdater ====================================================================== */

.indexText.listUpdater {
    margin-top: 30px;
}

.indexText.listUpdater ul {
    border-top: none;
}


/* ===== 4-2. index photo ====================================================================== */

.indexPhoto {
    font-size: 1.4rem;
    line-height: 1.2;
    margin: 15px auto 0;
    border-top: 1px solid #014e94;
    position: relative;
}

.indexPhoto h1 {
    font-size: 1.5rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

.indexPhoto ul {
    margin-top: 20px;
}

.indexPhoto li {
    display: inline-block;
    margin: 0 8px 8px 0;
}

.indexPhoto li.last {
    margin: 0 0 8px 0;
    clear: right;
}

.indexPhoto li a {
    text-align: center;
    display: block;
    border: 1px solid #e6e6e6;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    width: 126px;
    height: 126px;
}

.indexPhoto li a img {
    display: block;
    margin: 0 auto;
    vertical-align: middle;
    padding: 2px;
}

.photo-table {
    margin: 20px 0;
}

.photo-gallery-continue .photo-column {
    float: left;
    width: 33.3%
}

.photo-gallery-continue .photo-column p {
    margin: 4px 2px;
    border: 1px solid #efefef;
    line-height: 0;
    padding: 0;
}

.device-android .photo-gallery-continue .photo-column p {
    border: 1px solid #d1d1d1;
}

.photo-gallery-continue .photo-column p a {
    display: block;
    padding: 3px;
}

.photo-gallery-continue .photo-column img {
    border: 1px solid #dcdcdc;
    width: 100%;
}


/*-- for action */

.indexPhoto li a.image-loading {
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center 20%;
    background-repeat: no-repeat;
}

.morePhotos {
    font-size: 1.4rem;
    line-height: 1.4;
    display: block;
    margin: 15px;
    text-align: center;
    border: 1px solid #efefef;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
}

.morePhotos a, .morePhotos span {
    display: block;
    padding: 10px;
    vertical-align: middle;
    background: none;
}


/* ===== 4-3. index feature ====================================================================== */

.indexFeature {
    margin: 15px auto 0;
    border-top: 1px solid #014e94;
    position: relative;
}
.indexFeature:nth-child(n+2) {
    margin-top: 30px;
}
.indexFeature h1 {
    font-size: 1.5rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

.indexFeature ul {
    margin-top: 20px;
}

.indexFeature li {
    border-bottom: 1px solid #efefef;
}

.indexFeature li .featureTitle {
    border-bottom: 1px solid #efefef;
    display: block;
    overflow: hidden;
}

.indexFeature li .featureTitle img {
    display: block;
    float: left;
    max-height: 60px;
}

.indexFeature li .featureTitle a {
    font-size: 1.6rem;
    color: #333;
    display: block;
    margin: 0 0 0 80px;
    text-align: right;
}

.indexFeature li .featureTitle a span {
    font-weight: bold;
}

.indexFeature .featureTitle .view {
    font-size: 1.3rem;
    color: #003399;
    font-weight: normal;
    display: block;
    margin-top: 6px;
    padding: 0 24px 0 0;
    vertical-align: middle;
    background: url(../../../images/v2/common/arrow_more.png) 99% 50% no-repeat;
    background-size: 8px 12px;
}

.indexFeature .featureTitle .view img {
    display: inline;
    float: none;
    margin: 0 10px 0 0;
}

.indexFeature li a {
    display: block;
    padding: 6px;
}

.indexFeature ul li ul {
    margin: 10px 0 0;
}

.indexFeature ul li ul li {
    font-size: 1.3rem;
    font-weight: bold;
    display: block;
    margin: 0 10px 10px;
    background: url(../../../images/v2/common/list_point.png) left 7px no-repeat;
    background-size: 3px 3px;
    border-bottom: none;
}

.indexFeature ul li ul li a {
    display: block;
    padding: 0 0 0 12px;
}

.indexFeature .more {
    font-size: 1.4rem;
    line-height: 1.4;
    display: block;
    margin: 15px;
    text-align: center;
    border: 1px solid #efefef;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
}

.indexFeature .more a, .indexFeature .more span {
    display: block;
    padding: 10px;
    vertical-align: middle;
    background: none;
}


/* ===== 4-4. index ranking ====================================================================== */

.indexRanking {
    margin: 0 auto 30px;
    font-size: 1.5em;
    font-size: 1.5rem;
}

.indexRanking h1 {
    font-size: 2.2em;
    font-size: 2.2rem;
    color: #333;
    margin: 20px 0;
    padding-bottom: 18px;
    background: url(../../../images/v2/common/bg_categorytitle.png) left bottom repeat-x;
    position: relative;
}

.indexRanking ul.tab {
    width: 100%;
    border-left: 1px solid #e6e6e6;
    background-color: #fff;
    display: block;
}

.indexRanking ul.tab li {
    width: 120px;
    display: inline-block;
    border-right: 1px solid #e6e6e6;
    border-top: 1px solid #e6e6e6;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.indexRanking ul.tab li.current a {
    color: #575757;
    display: block;
    border-bottom: 1px solid #fff;
    margin-bottom: -1px;
}

.indexRanking ul.tab li a {
    display: block;
    text-align: center;
    padding: 8px 0 5px;
}

.indexRanking .modRankingwrap {
    display: block;
    margin: 0 10px 10px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.indexRanking ol {
    display: block;
    padding: 30px 0;
    border-top: 1px solid #e6e6e6;
}

.indexRanking ol li {
    margin-bottom: 8px;
    display: block;
}

.indexRanking ol li span {
    color: rgba(0, 0, 0, 0);
    width: 20px;
    height: 20px;
    margin-right: 5px;
    display: inline-block;
}

.indexRanking ol li span.rank01 {
    background: url(../../../images/v2/common/icon_list_rank01.png) center center no-repeat;
}

.indexRanking ol li span.rank02 {
    background: url(../../../images/v2/common/icon_list_rank02.png) center center no-repeat;
}

.indexRanking ol li span.rank03 {
    background: url(../../../images/v2/common/icon_list_rank03.png) center center no-repeat;
}

.indexRanking ol li span.rank04 {
    background: url(../../../images/v2/common/icon_list_rank04.png) center center no-repeat;
}

.indexRanking ol li span.rank05 {
    background: url(../../../images/v2/common/icon_list_rank05.png) center center no-repeat;
}

.indexRanking ol li span.rank06 {
    background: url(../../../images/v2/common/icon_list_rank06.png) center center no-repeat;
}

.indexRanking ol li span.rank07 {
    background: url(../../../images/v2/common/icon_list_rank07.png) center center no-repeat;
}

.indexRanking ol li span.rank08 {
    background: url(../../../images/v2/common/icon_list_rank08.png) center center no-repeat;
}

.indexRanking ol li span.rank09 {
    background: url(../../../images/v2/common/icon_list_rank09.png) center center no-repeat;
}

.indexRanking ol li span.rank10 {
    background: url(../../../images/v2/common/icon_list_rank10.png) center center no-repeat;
}

.indexRanking ol li span.rank11 {
    background: url(../../../images/v2/common/icon_list_rank11.png) center center no-repeat;
}

.indexRanking ol li span.rank12 {
    background: url(../../../images/v2/common/icon_list_rank12.png) center center no-repeat;
}

.indexRanking ol li span.rank13 {
    background: url(../../../images/v2/common/icon_list_rank13.png) center center no-repeat;
}

.indexRanking ol li span.rank14 {
    background: url(../../../images/v2/common/icon_list_rank14.png) center center no-repeat;
}

.indexRanking ol li span.rank15 {
    background: url(../../../images/v2/common/icon_list_rank15.png) center center no-repeat;
}

.indexRanking ol li span.rank16 {
    background: url(../../../images/v2/common/icon_list_rank16.png) center center no-repeat;
}

.indexRanking ol li span.rank17 {
    background: url(../../../images/v2/common/icon_list_rank17.png) center center no-repeat;
}

.indexRanking ol li span.rank18 {
    background: url(../../../images/v2/common/icon_list_rank18.png) center center no-repeat;
}

.indexRanking ol li span.rank19 {
    background: url(../../../images/v2/common/icon_list_rank19.png) center center no-repeat;
}

.indexRanking ol li span.rank20 {
    background: url(../../../images/v2/common/icon_list_rank20.png) center center no-repeat;
}

.indexRanking ol li span.rank21 {
    background: url(../../../images/v2/common/icon_list_rank21.png) center center no-repeat;
}

.indexRanking ol li span.rank22 {
    background: url(../../../images/v2/common/icon_list_rank22.png) center center no-repeat;
}

.indexRanking ol li span.rank23 {
    background: url(../../../images/v2/common/icon_list_rank23.png) center center no-repeat;
}

.indexRanking ol li span.rank24 {
    background: url(../../../images/v2/common/icon_list_rank24.png) center center no-repeat;
}

.indexRanking ol li span.rank25 {
    background: url(../../../images/v2/common/icon_list_rank25.png) center center no-repeat;
}

.indexRanking ol li span.rank26 {
    background: url(../../../images/v2/common/icon_list_rank26.png) center center no-repeat;
}

.indexRanking ol li span.rank27 {
    background: url(../../../images/v2/common/icon_list_rank27.png) center center no-repeat;
}

.indexRanking ol li span.rank28 {
    background: url(../../../images/v2/common/icon_list_rank28.png) center center no-repeat;
}

.indexRanking ol li span.rank29 {
    background: url(../../../images/v2/common/icon_list_rank29.png) center center no-repeat;
}

.indexRanking ol li span.rank30 {
    background: url(../../../images/v2/common/icon_list_rank30.png) center center no-repeat;
}

.indexRanking ol li .socialbutton {
    display: block;
    margin: 5px 0 0;
    padding: 0 0 5px 26px;
    border-bottom: 1px dotted #B2B2B2;
}

.indexRanking ol li .socialbutton ul {
    height: 24px;
}

.indexRanking ol li .socialbutton li {
    display: inline-block;
    vertical-align: middle;
    width: 100px;
    height: 24px;
}


/* ===== 4-5. index region ====================================================================== */

.indexRegion {
    font-size: 1.4rem;
    line-height: 1.2;
    margin: 15px auto 0;
    border-top: 1px solid #014e94;
    position: relative;
}

.indexRegion h1 {
    font-size: 1.5rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

.indexRegion .listNav {
    width: 100%;
    background: #fff;
}

.indexRegion .listNav ul {
    border-top: 1px #D9DDE3 solid;
    margin: 20px 0 25px;
    display: table;
    width: 100%;
}

.indexRegion .listNav li {
    display: inline-block;
    width: 50%;
    border-bottom: 1px #D9DDE3 solid;
}

.indexRegion .listNav a {
    padding: 10px;
    color: #3E3D32;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    box-sizing: border-box;
    background: url(http://www.sankei.com/smp/apr_news/images/v2/common/arrow_more.png) 96% 50% no-repeat;
    background-size: 8px 12px;
}

.indexRegion .listNav li:nth-child(odd) a {
    border-right: 1px #D9DDE3 solid!important;
}


/* --------------------------------------------
6. detail styles
--------------------------------------------*/


/* ===== 5-1. news detail ====================================================================== */

.articleText {
    margin: 0 auto 20px;
    position: relative;
}

.articleText article h1 {
    font-size: 2rem;
    line-height: 1.4;
    padding: 15px 10px 0;
}

.articleText article .readMore{
	font-size: 1.4rem;
  line-height: 1.4;
	margin: 8px;
}

.articleText article .addition {
    font-size: 1.2rem;
    color: #666;
    display: block;
    margin: 6px 10px;
}

.articleText article .addition .subtitle {}

.articleText article .addition time {
    float: right;
    display: block;
}

.articleText article .addition .credit img {
    height: 20px;
}

.articleText article p {
    font-size: 1.6rem;
    line-height: 1.6;
    margin-bottom: 15px;
    padding: 0 10px;
}
/*article group*/
.articleText article p.pagePrev a{
	background: url(../../../images/v2/common/icon_group_pagePrev.png) left center no-repeat;
  background-size: contain;
	padding-left: 30px;
	height: 21px;
}
.articleText article p.pageNext a{
	display: block;
	background: url(../../../images/v2/common/icon_group_pageNext.png) right center no-repeat;
  background-size: contain;
	text-align: right;
}
.articleText article p.pageNext a {
	padding-right: 30px;
}
/*article group*/


/* add information /20140415 ===== */

.articleText article .addInformation {
    margin: 15px;
    padding: 15px 0px 0;
    border-top: 1px dotted #ccc;
    border-bottom: 1px dotted #ccc;
}
.articleText article .addInformation p {
    font-size: 13px;
    font-size: 1.3rem;
    line-height: 1.4em;
}


/* add information /20140415 ===== */
.articleText .photo {
    float: right;
    margin: 0 6px 5px 12px;
}
.articleText .articlePhotowrap {
    float: right;
    margin: 0 6px 5px 12px;
    position: relative;
}
.articleText .articlePhotowrap span {
    font-size: 1.2rem;
    color: #fff;
    margin: 5px;
    padding: 5px 10px 5px 22px;
    position: absolute;
    bottom: 0;
    right: 0;
    display: block;
    background: url(../../../images/v2/common/search_white.png) rgba(0, 0, 0, 0.5) 5px center no-repeat;
    background-size: 12px 12px;
}
.editorProfile {
    border: 1px solid #0159a9;
    padding: 10px;
    margin: 10px;
}
.editorProfile span {display: block;}
.editorProfile .photo {
    display: block;
    float: left;
    margin: 0 10px 0 0;
    width: auto;
}

.editorProfile .photo img {
    margin: 0;
    padding: 0;
    max-height: 80px;
    max-width: 80px;
}

.editorProfile .text {
    font-size: 1.4rem;
    line-height: 1.5;
}

.editorProfile .text .title {
    font-weight: bold;
    margin-bottom: 10px;
    display: block;
}

.articleText .socialbutton span.credit {
    display: inline-block;
    float: right;
}

.articleText article .photoWired {
    display: block;
    margin: 0 auto 10px;
    text-align: center;
}

.articleText article .photoWired a {
    text-align: center;
}

.articleText article .photoWired img {
    display: block;
    width: 100%;
    max-width: 600px;
    text-align: center;
    margin: 0 auto;
}

.skduiSocialButton {
    margin: 0 auto;
    text-align: center;
    display: block;
}



/*=== 記事内装飾タグ ===*/


/* スポンサードコンテンツ用写真css */

.articleText article .photoWired {
    display: block;
    margin: 0 auto 10px;
    width: 100%;
    text-align: center;
}

.articleText article .photoWired a {
    text-align: center;
    display: block;
    border: 1px solid #e6e6e6;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    width: 100%;
}

.articleText article .photoWired img {
    display: block;
    margin: 2px auto 0;
    vertical-align: middle;
    padding: 0 0 2px;
}


/* 動画 */

.articleText .movie {
    display: block;
    margin: 0 auto 15px;
    padding: 10px 0;
    text-align: center;
    background: #121411;
}

.articleText .movie iframe {
    width: 100% !important;
    margin: 15px auto;
}


/* 小見出し */

.articleText span.subhead {
    display: block;
    font-size: 17px;
    font-size: 1.7rem;
    border-left: 8px solid #0159a9;
    padding-left: 10px;
    margin-top: 1.5em;
}


/* 太字 */

.articleText span.strong {
    font-weight: bold;
}


/* 中央揃え */

.articleText span.center {
    display: block;
    text-align: center;
}


/* 右揃え */

.articleText span.right {
    display: block;
    text-align: right;
}

.articleText .articleRelatednews {
    display: block;
    margin: 20px auto;
}

.articleText .articleRelatednews li {
    font-size: 1.4rem;
    display: block;
    margin: 0 10px 5px;
    background: url(../../../images/v2/common/list_point.png) left 7px no-repeat;
    background-size: 3px 3px;
    border-bottom: none;
}

.articleText .articleRelatednews li a {
    display: block;
    padding: 0 0 0 12px;
}


/* 次のページへ */

#NextPage {
    font-size: 14px;
    font-size: 1.4rem;
    line-height: 1.6;
    text-align: center;
    border-top: 1px solid #ccc;
    margin-top: 20px;
    padding: 15px 10px 0;
}

#NextPage a:before {
    content: '次ページ >';
    font-size: 11px;
    font-size: 1.1rem;
    color: #FFF;
    background-color: #014686;
    margin-right: 5px;
    padding: 5px 5px 4px 7px;
    display: inline-block;
    vertical-align: middle;
    border-radius: 3px;
}


/* 記事内ページング */

#PageNation {
    font-size: 15px;
    font-size: 1.5rem;
    text-align: center;
    margin: 15px 0;
}

#PageNation li {
    text-align: center;
    display: inline-block;
    margin-right: 4px;
    line-height: 1.4;
}

#PageNation li a {
    padding: 4px 10px;
    color: #fff;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    background: #014e94;
}

#PageNation li a.pagePrev:before {
    content: ' < ';
}

#PageNation li a.pageNext:after {
    content: ' >';
}

#PageNation li.PageNationActive {
    background-color: #fff;
    text-decoration: none;
    width: 30px;
    height: 32px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    padding: 5px 8px;
    line-height: 1.3;
    margin-right: 4px;
}


/* ===== 5-2. photo detail ====================================================================== */

#modPhotoslider {
    margin: 15px auto 30px;
}

#modPhotoslider .photo {
    float: none;
    margin: 5px 0;
}

#modPhotoslider .swiper-container {
    height: 400px;
    width: 100%;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.js #modPhotoslider .swiper-container.image-loading {
    background-image: url(../../../images/v2/common/loading.gif) !important;
    background-position: center 45% !important;
    background-repeat: no-repeat !important;
    padding: 0 !important;
}

#modPhotoslider .swiper-container .swiper-wrapper .swiper-slide {
    width: 100%;
    text-align: center;
}

#modPhotoslider .swiper-container .swiper-wrapper .swiper-slide a, #modPhotoslider .swiper-container .swiper-wrapper .swiper-slide div.photoWrapper {
    display: block;
    height: 320px;
    margin: 0 auto;
}

#modPhotoslider .swiper-container.image-loading .swiper-wrapper .swiper-slide a, #modPhotoslider .swiper-container.image-loading .swiper-wrapper .swiper-slide div.photoWrapper {
    visibility: hidden;
}

#modPhotoslider .photoWrapper {
    margin: 10px 0;
}

#modPhotoslider .swiper-container .swiper-wrapper .swiper-slide a .photo, #modPhotoslider .swiper-container .swiper-wrapper .swiper-slide div .photo {
    margin: 0 10px;
    height: 320px;
    border: 1px solid #efefef;
    float: none;
}

#modPhotoslider .photo img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}

#modPhotoslider .swiper-container .swiper-wrapper .swiper-slide a .cap, #modPhotoslider .swiper-container .swiper-wrapper .swiper-slide div .cap {
    font-size: 1.2rem;
    text-align: left;
    padding: 5px;
}

#modPhotoslider .pagination .pagePrev {
    background-color: rgba(0, 0, 0, 0.6);
    display: block;
    width: 40px;
    height: 40px;
    left: 0;
    position: absolute;
    text-align: center;
    top: 140px;
    opacity: 0;
    transition: all 0.4s ease;
}

#modPhotoslider .pagination .pagePrev span {
    background: url(../../../images/v2/common/arrow_prev.png) center center no-repeat;
    background-size: 16px 16px;
    display: block;
    width: 40px;
    height: 40px;
}

#modPhotoslider .pagination .pageNext {
    background-color: rgba(0, 0, 0, 0.6);
    display: block;
    width: 40px;
    height: 40px;
    right: 0;
    position: absolute;
    text-align: center;
    top: 140px;
    opacity: 0;
    transition: all 0.4s ease;
}

#modPhotoslider .pagination .pageNext span {
    background: url(../../../images/v2/common/arrow_next.png) center center no-repeat;
    background-size: 16px 16px;
    display: block;
    width: 40px;
    height: 40px;
}

#modPhotoslider .modPhotoback {
    margin: 0 auto;
    padding: 10px 0;
}

#modPhotoslider .modPhotoback .more {
    display: block;
    float: left;
    margin: 0 0 0 10px;
    vertical-align: middle;
}

#modPhotoslider .modPhotoback .more a, #modPhotoslider .modPhotoback .more span {
    font-size: 1.2rem;
    line-height: 30px;
    display: block;
    padding: 0 16px 0 28px;
    background: url(../../../images/v2/common/arrow_back.png) #efefef 10% 50% no-repeat;
    background-size: 8px 12px;
}

#modPhotoslider .modPhotoback .morePhoto {
    display: block;
    float: right;
    margin: 0 10px 0 0;
    vertical-align: middle;
}

#modPhotoslider .modPhotoback .morePhoto a {
    font-size: 1.2rem;
    line-height: 30px;
    display: block;
    padding: 0 28px 0 16px;
    background: url(../../../images/v2/common/arrow_more.png) #efefef 90% 50% no-repeat;
    background-size: 8px 12px;
}


/* ===== 5-3. feature detail ====================================================================== */


.articleFeature {
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.2;
    margin: 30px auto 0;
    border-top: 1px solid #014e94;
    position: relative;
}

.articleFeature h1 {
    font-size: 1.5rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

.articleFeature p {
    font-size: 15px; font-size: 1.5rem;
    padding: 25px 10px 20px;
    color: #333;
}
.articleFeature p.featureRead{padding: 10px !important;}

.articleFeature ul.featureNews {}
.articleFeature ul.featureNews li {
    border-bottom: 1px solid #efefef;
}

.articleFeature ul.featureNews li a {
    display: block;
    min-height: 30px;
    padding: 6px;
}

.articleFeature ul.featureNews li a img {
	height: 15px;
	margin: 5px 0 0 5px;
}

.articleFeature ul.featureNews .photo{
    display: block;
    float: right;
    margin: 0 0 0 6px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
}
.articleFeature ul.featureNews .size-thumb1 {
    width: 80px;
    height: 80px;
    overflow: hidden;
    text-align: center;
    border:1px solid #efefef;
    -moz-box-sizing:border-box;
    -webkit-box-sizing: border-box;
    box-sizing:border-box;
    /* center */
    display: flex;
    justify-content: center;
    align-items: center;
}
.articleFeature ul.featureNews .size-thumb1 img {
	margin:0;
	width:auto;
	height: auto;
	max-width: 100%;
	max-height: 100%;
}



.articleFeature ul.featureNews li .addition {
    font-size: 1.2rem;
    color: #666;
    display: block;
    margin: 6px 0 2px;
}

.articleFeature ul.featureNews li .addition .subtitle {
    background-color: #efefef;
    padding: 2px 5px;
}

.articleFeature ul.featureNews li .addition time {
    display: block;
    padding-top: 5px;
}

.articleFeature ul.featurePhoto {
    margin-top: 15px;
}

.articleFeature ul.featurePhoto li {
    display: inline-block;
    margin: 0 8px 8px 0;
}

.articleFeature ul.featurePhoto li.last {
    margin: 0 0 8px 0;
    clear: right;
}

.articleFeature ul.featurePhoto li a {
    text-align: center;
    display: block;
    border: 1px solid #e6e6e6;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    width: 126px;
    height: 126px;
}

.articleFeature ul.featurePhoto li a img {
    display: block;
    margin: 0 auto;
    vertical-align: middle;
    padding: 2px;
}

.articleFeature .more {
    font-size: 1.4rem;
    line-height: 1.4;
    display: block;
    margin: 15px;
    text-align: center;
    border: 1px solid #efefef;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 6px 2px;
}

.articleFeature .more a, .articleFeature .more span {
    display: block;
    padding: 10px;
    vertical-align: middle;
    background: none;
}
/*--------------------  自由編集枠用パーツ 2017/6/7 */
	/*---------- タイトル */
.articleFeature .featureTitle{font-size: 1.6rem;background: #113b7d;border-radius: 4px 4px 0 0;color: #fff;margin: 15px 10px 10px;padding: 6px 0;text-align: center;}
.articleFeature .featureTitle02{font-size: 1.6rem;color: #113B7D;font-weight: bold;margin: 20px 10px 15px;border-left: 5px solid #113B7D;padding-left: 8px;}
.articleFeature .featureTitle03{font-size: 1.6rem;color: #113b7d;font-weight: 700;margin: 15px 10px 5px;}
.articleFeature .featureTitle04{font-size: 1.6rem;margin: 15px 10px 5px;font-weight: 700;border-radius: 2px;border: 1px solid #113b7d;padding: 5px;}
	/*---------- 画像 */
.articleFeature .featurePhoto{text-align: center; padding-bottom: 25px; margin: 10px;}
.articleFeature .featurePhoto img{width: auto;height: auto; max-width: 100%; max-height: 100%;}
.featurePhoto{text-align: center; padding-bottom: 25px; margin: 10px;}
.featurePhoto img{width: auto;height: auto; max-width: 100%; max-height: 100%;}
.articleFeature .photoArea{text-align: center; padding-bottom: 25px;margin: 10px;}
.articleFeature .photoArea img{width: auto;height: auto; max-width: 100%; max-height: 100%;}
.articleFeature .photoArea .cap{font-size: 12px; font-size: 1.2rem;}
/* 本文 */
.articleFeature .textArea{font-size: 15px; font-size: 1.5rem; line-height: 1.3;margin: 15px 10px 5px;}
.articleFeature .textArea p{margin-bottom: 2rem;padding: 10px!important;}
.articleFeature .textArea .att{font-size: 12px; font-size: 1.2rem;color: #888;}
.articleFeature .textArea .att.bg{background: #fefefe;border: 1px solid #ccc; border-radius:2px; padding:8px;margin: 8px 0;}
/*---------- 差し込み記事 */
.articleFeature .insertArticle{font-size: 1.4rem; margin: 0 10px 10px; padding: 10px; line-height: 1; }
.articleFeature .insertArticle .title{background: url(../../../apr_news/images/v2/common/arrow_more.png) left 2px no-repeat;background-size: 10px auto;margin-bottom: 5px;display: block;padding:0 0 0 15px !important;line-height: 1.4;    color: #039;}
/*---------- btn ※ 要float解除 */
/* 内部link */
.articleFeature .featureBtn {font-size: 1.4rem;margin: 10px;text-align: center;line-height: 1.4;box-sizing: border-box;}
.articleFeature .featureBtn a{display: block;padding: 10px 0;background: #111;color: #fff;}
/* 外部link */
.articleFeature .featureBtn.blank{border: 4px solid #efefef;}
.articleFeature .featureBtn.blank a{font-size: 1.4rem;background: #fff;color: #113b7d;	background: url(http://www.sankei.com/apr_news/images/v1/common/icon_list_outerblue.png) 10px center no-repeat;	padding-left: 20px;}
.articleFeature .featureBtn.blank a:hover{background: #cce1f5 url(http://www.sankei.com/apr_news/images/v1/common/icon_list_outerblue.png) 10px center no-repeat;}
/*------------- 人物紹介枠 */
.articleFeature .introduce{background:#fff;border: 1px solid #ccc;margin: 10px;box-sizing: border-box;font-size: 1.4rem;line-height: 1.4;}
.articleFeature .introduce p{padding: 10px!important;}
.articleFeature .introduce.left{float:left;}
.articleFeature .introduce.right{float:right;}
.articleFeature .introName{font-size: 1.8rem;font-weight: bold;margin-bottom: 8px;}
.articleFeature .introduce .more{display:block;padding:5px;text-align: right;font-size: 1.4rem;text-align: center;}
.articleFeature .wrapper{margin-bottom: 30px;}
.articleFeature .wrapper .textArea{margin: 20px 10px 15px;}
/* padding除外 */
.articleFeature .featureTitle{margin:20px 0 0 0 !important;}
/*--------------------  自由編集枠用パーツ 2017/6/7 */


/*-------------------- ironna & PARA☆DO 2017/1/5 */
/* bace */
,.featureIronna,.featureParado {margin: 0 10px 30px;}
.indexText.featureNews,.indexText.featureIronna,.indexText.featureParado{margin: 0 10px 30px;}
/* header */
.nichiroHeaderImg, .featureHeaderImg{width: 100%;}
.nichiroHeaderImg img, .featureHeaderImg img{display: block;width: 100%;}
/* title要素 */
.featureIronna .featureTitle,
.featureParado .featureTitle,
.featureNews .featureTitle{font-size: 16px; font-size: 1.6rem;background:#113B7D;border-radius: 4px 4px 0 0;color: #fff;margin: 15px 0 10px;padding:6px 0;text-align: center;}
.featureParado .featureTitle a{color:#fff;}
.featureParado .featureTitle a span{margin-left:10px; font-size:10px;font-weight: 300;}
/* list要素 */
.indexText.featureNews,.indexText.featureIronna,.indexText.featureParado {border-top: none !important;}
.indexText.featureNews ul,.indexText.featureIronna ul,.indexText.featureParado ul {margin-top: 0; border-top: 1px solid #efefef;border-left: 1px solid #efefef;border-right: 1px solid #efefef;}
.indexText.featureNews li a{min-height: 80px;}
.indexText.featureParado li a{ display: block; min-height: 58px;}
.indexText.featureParado .sponsored{text-align:right; margin-top:5px;font-size:12px;color:#999;}
.indexText.featureParado .sponsored img{width: 60px; vertical-align:bottom;}
/*--------------------  PARA☆DO 2017/1/5 */

/*-- for action */
.articleFeature ul.featurePhoto li a.image-loading {
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center 20%;
    background-repeat: no-repeat;
}


/* ===== module election map ===== */

#primary #modElMeibo {
    font-size: 1.4rem;
    line-height: 1.2;
    margin: 30px auto 20px;
    border-top: 1px solid #014e94;
    position: relative;
}


/* 2-1. 見出し*/

#primary #modElMeibo h1 {
    font-size: 1.5rem;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
    background-color: #fff;
}

#primary #modElMeibo h2 {
    font-size: 1.4em;
    font-size: 1.4rem;
    font-weight: bold;
    margin-top: 15px;
    padding: 0 0 10px 10px;
    border-bottom: 3px solid #4d4d4d;
}


/* 2-1. 選挙マップ*/

.modElMeiboList {}

.modElMeiboList .nationalmap li, .modElMeiboList .nationalmapH li {
    float: left;
    width: 25%;
}

.modElMeiboList .nationalmap li a, .modElMeiboList .nationalmapH li a {
    background: none repeat scroll 0 0 #E5E5E5;
    border-bottom: 1px solid #E1E1E1;
    border-right: 1px solid #E1E1E1;
    color: #333333;
    background: -moz-linear-gradient(top, white, #eeeeee);
    background: -webkit-gradient(linear, left top, left bottom, from(white), to(#eeeeee));
    display: block;
    min-height: 1.3em;
    overflow: hidden;
    padding: 8px 4px;
    text-align: center;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* === 2017wbc */
ul.gameList{margin-bottom: 15px;border: 1px solid #ccc;}
ul.gameList:last-child{margin-bottom: 30px;}
.gameList li{
	line-height: 1.5;
	border-bottom: 1px solid #ccc;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 14px;
	font-size: 1.4rem;
}
.gameList li:last-child{border-bottom: 0px;}
.gameList li a{display: block;}
.gameList li a span{padding-right: 5px;font-size: 18px;font-size: 1.8rem;}
.gameList li a span.JPN{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_jpn.gif)left center no-repeat;
}
.gameList li a span.CUB{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_cub.gif)left center no-repeat;
}
.gameList li a span.AUS{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_aus.gif)left center no-repeat;
}
.gameList li a span.CHN{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_chn.gif)left center no-repeat;
}
.gameList li a span.NED{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_ned.gif)left center no-repeat;
}

.gameList li a span.ISR{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_isr.gif)left center no-repeat;
}
.gameList li a span.DOM{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_dom.gif)left center no-repeat;
}
.gameList li a span.PRI{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_pri.gif)left center no-repeat;
}
.gameList li a span.USA{
padding-left: 22px;
background: url(http://www.sankei.com/smp/apr_news/images/v2/rio2016/flags/12_usa.gif)left center no-repeat;
}

/* ===== 4-1-1. index text tabstyle ====================================================================== */

.articleFeature .titleTabstyle {
    font-size: 1.3rem;
    margin-top: 0;
    color: #fff;
    border-bottom: 3px solid #89b1d7;
    background-color: #acd0f3;
}

.articleFeature .titleTabstyle ul {
    border: none;
}

.articleFeature .titleTabstyle li {
    padding: 5px 0;
    display: inline-block;
    vertical-align: middle;
    width: 46%;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    border: none;
}

.articleFeature .titleTabstyle li.selected {
    font-size: 1.5rem;
    padding: 8px 0 5px;
    width: 52%;
    margin-top: -5px;
    color: #fff;
    background-color: #89b1d7;
    border-right: 3px solid #fff;
}

.articleFeature .titleTabstyle li.selected:nth-of-type(2) {
    border-left: 3px solid #fff;
    border-right: none;
}

.articleFeature .titleTabstyle a {
    color: #fff;
    display: block;
    height: auto;
    min-height: 10px;
    padding: 0;
}

.articleFeature.tabstyle {
    font-size: 1.4rem;
    line-height: 1.2;
    margin: 0 auto;
    border-top: none;
    position: static;
}


/* ===== 4-1-2. index text listUpdater ====================================================================== */

.articleFeature.listUpdater {
    margin-top: 30px;
}

.articleFeature.listUpdater ul {
    border-top: none;
}


/* ===== 5-4. social box ====================================================================== */

.socialbutton {
    margin: 15px auto;
    padding: 0 10px;
    text-align: center;
    color: #fff;
    font-size: 1.2rem;
    font-weight: bold;
    line-height: 30px;
}

.socialbutton a {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    height: 30px;
    padding: 5px;
}


/* custom buttons */

a.sknui-sns img {
    width: 19px;
    height: 20px;
    margin-top: 5px;
}

a.sknui-tw {
    background-color: #40bff5;
}

a.sknui-fb {
    background-color: #3b5998;
}

a.sknui-line {
    background-color: #41d500;
}

article .twList {
    height: 20px;
    width: 46px;
    background-color: #fff;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    margin-left: 6px;
    position: relative;
    border: 1px solid #ccc;
    vertical-align: top;
    display: inline-block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
}

article .twList:after, article .twList:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
}

article .twList:after {
    border-right-color: #ffffff;
    border-width: 3px;
    margin-top: -3px;
}

article .twList:before {
    border-right-color: #cccccc;
    border-width: 5px;
    margin-top: -5px;
}

article .twList a {
    font-size: 12px;
    color: #0c7abf;
    padding: 2px 10px;
    line-height: 20px;
}


/* --------------------------------------------
6. others
--------------------------------------------*/


/* ===== 6-1. static ====================================================================== */


/*
 * widget default styles for appBox
 */

#contentsOverlay {
    width: 100%;
    background-color: #c0c0c0;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: none;
}

#contentsOverlay.active {
    display: block;
}

.rgba #contentsOverlay {
    background-color: rgba(0, 0, 0, 0.4);
}

#windowContainer {
    width: 100%;
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}

#windowContainer .boxWrapper {
    height: 1px;
    overflow: hidden;
}


/* ===== 6-2. slide menu ====================================================================== */

html {
	height: 100%;
}
body {
	height: 100%;
	overflow-x: hidden;
}

#slideSideMenu .overlay {
	display: none;
	width: 100%;
	height: 120%;
	position: fixed;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.5);
}

#slideSideMenu .container {
	position: fixed;
	top: 0;
	right: 0;
	height: 100%;
	width: 85%;
	max-width: 260px;
	background-color: #333;
	font-size: 1.4rem;
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	-webkit-transform: translate3d(300px, 0, 0);
	-ms-transform: translate3d(300px, 0, 0);
	transform: translate3d(300px, 0, 0);
	-webkit-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#slideSideMenu .container > * {
	-webkit-transform: translateZ(0);
}

#slideSideMenu .container.active {
	-webki-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}

#slideSideMenu .container .ssmHeader {
    height: 32px;
    border-bottom: 1px solid #000;
    box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -moz-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, .4);
    background-color: #333;
    padding: 17px 0px 0px 19px;
    text-decoration: none;
    color: #fff;
    font-size: 1.4rem;
    position: relative;
}

.fixed #contentsContainer {
	position: fixed;
}
.fixed #slideSideMenu {
	display: block;
}
.fixed #slideSideMenu .overlay {
	display: block;
}

#slideSideMenu li {
    list-style: none;
    border-top: 1px solid #4D4D4D;
    border-bottom: 1px solid #000;
    font-size: 14px;
    line-height: 1.8;
}

#slideSideMenu li a {
    padding: 10px 0 10px 20px;
    display: block;
    text-decoration: none;
    color: #fff;
}

#slideSideMenu li a.hasSub {
    float: left;
    width: 160px;
}


/*
#slideSideMenu li:last-child {
	border-bottom: none;
}
*/

#slideSideMenu ul.subcategory {
    background-color: #f5f5f5;
    clear: both;
    display: none;
    opacity: 0;
    -webkit-transition: opacity 500ms ease-out;
    -moz-transition: opacity 500ms ease-out;
    -o-transition: opacity 500ms ease-out;
    -ms-transition: opacity 500ms ease-out;
    transition: opacity 500ms ease-out;
}

#slideSideMenu ul.subcategory.active {
    display: block;
}

#slideSideMenu ul.subcategory.active.fade {
    opacity: 1;
}

#slideSideMenu ul.subcategory li {
    border-top: 1px dotted #4D4D4D;
    border-bottom: none;
}

#slideSideMenu ul.subcategory li:first-child {
    border-top: none;
}

#slideSideMenu ul.subcategory li a {
    color: #333;
}

#slideSideMenu .toggleBtn {
    padding: 8px 10px 8px 20px;
    float: left;
}

#slideSideMenu .toggleBtn span {
    position: relative;
    width: 30px;
    height: 30px;
    display: block;
    background-color: #c0c0c0;
}

#slideSideMenu .toggleBtn .hLine {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 30px;
    height: 30px;
    background: url(../../../images/v2/common/fallback/h.png) 50% 50% no-repeat;
}

#slideSideMenu .toggleBtn .vLine {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    display: block;
    width: 30px;
    height: 30px;
    background: url(../../../images/v2/common/fallback/v.png) 50% 50% no-repeat;
    -webkit-transition: all 500ms ease-out;
    -moz-transition: all 500ms ease-out;
    -o-transition: all 500ms ease-out;
    -ms-transition: all 500ms ease-out;
    transition: all 500ms ease-out;
}

.backgroundsize #slideSideMenu .toggleBtn .hLine {
    background: url(../../../images/v2/common/h.png) 50% 50% / 20px 20px no-repeat;
}

.backgroundsize #slideSideMenu .toggleBtn .vLine {
    background: url(../../../images/v2/common/v.png) 50% 50% / 20px 20px no-repeat;
}

#slideSideMenu .toggleBtn.opened .vLine {
    top: 35px;
    opacity: 0;
}


/*=== メニュー用CSS（memu/imdex.html） ===*/

#siteMenuLists {
    border-top: 1px solid #efefef;
}

#siteMenuLists>h1 {
    font-size: 1.5em;
    font-size: 1.5rem;
    text-align: left;
    line-height: 1.2;
    font-weight: bold;
    padding: 10px;
    background-color: #333;
    background: #333;
    /* Old browsers */
}

#siteMenuLists>h1 {
    color: #fff!important;
}

.ssmList ul, .ssmList h1 {
    color: #333;
    font-size: 1.5px;
    font-size: 1.5rem;
}

.ssmList li, .ssmList h1 {
    border-bottom: 1px solid #efefef;
}

.ssmList li {
    text-indent: 1em;
}

.ssmList h1 a {
    color: #333;
    display: block;
    padding: 12px 20px 12px 10px;
    background: url(../../../images/v2/common/fallback/arrow_off.png) 98% 50% no-repeat;
}

.ssmList li a {
    color: #333;
    display: block;
    padding: 10px 20px 10px 10px;
    background: url(../../../images/v2/common/fallback/arrow_off.png) 98% 50% no-repeat;
}

.ssmList li a:hover, .ssmList h1 a:hover {
    background: url(../../../images/v2/common/fallback/arrow_on.png) 98% 50% no-repeat;
}

.backgroundsize .ssmList li a, .backgroundsize .ssmList h1 a {
    background: url(../../../images/v2/common/arrow_off.png) 98% 50% / 6px 10px no-repeat;
}

.backgroundsize .ssmList li a:hover, .backgroundsize .ssmList h1 a:hover {
    background: url(../../../images/v2/common/arrow_on.png) 98% 50% / 6px 10px no-repeat;
}


/* ===== 6-3. shimenview ====================================================================== */

.modShimenview h1 {
    font-size: 1.5em;
    font-size: 1.5rem;
    color: #fff;
    text-align: left;
    line-height: 1.2;
    font-weight: bold;
    text-shadow: 0 -1px 1px #666;
    padding: 8px 10px;
    background: #0064C0;
    /* Old browsers */
}

.modShimenview .widget {
    text-align: center;
    margin: 0 auto;
}

.modShimenview .widget img {
    max-width: 90%;
}


/* Botton */

.modShimenview ul {
    margin: 0 auto;
    padding: 15px;
}

.modShimenview ul li {
    clear: none;
    margin-bottom: 15px;
}


/**/

.modShimenview ul.btn li:first-child a {
    margin-bottom: 10px;
}

.modShimenview ul.btn li:last-child a {}

.modShimenview ul.btn li a {
    display: block;
    background: #0066cc;
    font-size: 1.5em;
    font-size: 1.5rem;
    text-align: center;
    height: 40px;
    line-height: 40px;
    color: #fff;
}

.modShimenview ul.btn li a:hover {
    background: #014e94;
    /* Old browsers 014e94 */
    background: -moz-linear-gradient(top, #0064c0 0%, #014e94 50%);
    /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0064c0), color-stop(50%, #014e94));
    /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #0064c0 0%, #014e94 50%);
    /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #0064c0 0%, #014e94 50%);
    /* Opera 11.10+ */
    /* W3C */
}


/* ===== 6-4. frequencyお問い合わせ ====================================================================== */

.frequency {
    font-size: 1.5rem;
    line-height: 1.2;
    margin-bottom: 2em;
}

.frequency h1 {
    font-size: 1.5rem;
    color: #fff;
    text-align: left;
    line-height: 1.2;
    font-weight: bold;
    text-shadow: 0 -1px 1px #666;
    padding: 8px 10px;
    background: #0064C0;
    /* Old browsers */
}

.frequency h2 {
    text-align: left;
    font-size: 1.7rem;
    font-weight: bold;
    padding: 5px 10px;
    border-bottom: 3px solid #0064C0;
    margin: 1em 0;
    -webkit-box-shadow: 0px 3px 5px 0px rgba(206, 206, 206, 0.7);
    -moz-box-shadow: 0px 3px 5px 0px rgba(206, 206, 206, 0.7);
    box-shadow: 0px 3px 5px 0px rgba(206, 206, 206, 0.7);
}

.frequency p {
    font-size: 1.5rem;
    line-height: 1.2;
    margin: .5em .5em 0;
}

.frequency more {
    margin-bottom: 2rem;
}


/* ===== 6-5. swiper ====================================================================== */


/*
 * Swiper 2.7.0
 * Mobile touch slider and framework with hardware accelerated transitions
 *
 * http: //www.idangero.us/sliders/swiper/
 *
 * Copyright 2010-2014, Vladimir Kharlampidi
 * The iDangero.us
 * http: //www.idangero.us/
 *
 * Licensed under GPL & MIT
 *
 * Released on: August 30, 2014
*/


/* ===============================================================
Basic Swiper Styles
================================================================*/

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    /* Fix of Webkit flickering */
    z-index: 1;
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    -webkit-transition-property: -webkit-transform, left, top;
    -webkit-transition-duration: 0s;
    -webkit-transform: translate3d(0px, 0, 0);
    -webkit-transition-timing-function: ease;
    -moz-transition-property: -moz-transform, left, top;
    -moz-transition-duration: 0s;
    -moz-transform: translate3d(0px, 0, 0);
    -moz-transition-timing-function: ease;
    -o-transition-property: -o-transform, left, top;
    -o-transition-duration: 0s;
    -o-transform: translate3d(0px, 0, 0);
    -o-transition-timing-function: ease;
    -o-transform: translate(0px, 0px);
    -ms-transition-property: -ms-transform, left, top;
    -ms-transition-duration: 0s;
    -ms-transform: translate3d(0px, 0, 0);
    -ms-transition-timing-function: ease;
    transition-property: transform, left, top;
    transition-duration: 0s;
    transform: translate3d(0px, 0, 0);
    transition-timing-function: ease;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.swiper-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto;
}

.swiper-slide {
    float: left;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}


/* IE10 Windows Phone 8 Fixes */

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
}


/* add for zoom function */

.swiper-zoom-sets {
    position: relative;
}

.swiper-zoom-msg {
    display: none;
    position: absolute;
    top: 20%;
    left: 25%;
    z-index: 2;
    ;
    width: 50%;
    background-color: rgb(0, 0, 0);
    color: #fff;
    border-radius: 3px;
}

.swiper-zoom-msg p {
    padding: 5% 5% 5% 32%;
    font-size: 16px;
    background: url("../../../images/v2/common/fallback/search_white.png") no-repeat 5% 50%;
}


.backgroundsize .swiper-zoom-msg p {
    background: url("../../../images/v2/common/fallback/search_white.png") no-repeat 5% 50%;
    background-size: 48px 48px;
}

.rgba .swiper-zoom-msg {
    background-color: rgba(0, 0, 0, 0.6);
}

.swiper-zoom-msg.ready-animation {
    display: block;
    opacity: 0;
}

.swiper-zoom-msg.active-animation {
    -webkit-animation-duration: 3s;
    -webkit-animation-name: fade-in-out;
    -moz-animation-duration: 3s;
    -moz-animation-name: fade-in-out;
    -o-animation-duration: 3s;
    -o-animation-name: fade-in-out;
    -ms-animation-duration: 3s;
    -ms-animation-name: fade-in-out;
    animation-duration: 3s;
    animation-name: fade-in-out;
}

/*
*/
@-webkit-keyframes fade-in-out {
    from {
        opacity: 0.2;
    }
    10% {
        opacity: 0.4;
    }
    20% {
        opacity: 0.8;
    }
    30% {
        opacity: 0.9;
    }
    40% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 1;
    }
    70% {
        opacity: 0.9;
    }
    80% {
        opacity: 0.8;
    }
    90% {
        opacity: 0.4;
    }
    to {
        opacity: 0.2;
    }
}

@-moz-keyframes fade-in-out {
    from {
        opacity: 0.2;
    }
    10% {
        opacity: 0.4;
    }
    20% {
        opacity: 0.8;
    }
    30% {
        opacity: 0.9;
    }
    40% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 1;
    }
    70% {
        opacity: 0.9;
    }
    80% {
        opacity: 0.8;
    }
    90% {
        opacity: 0.4;
    }
    to {
        opacity: 0.2;
    }
}

@-o-keyframes fade-in-out {
    from {
        opacity: 0.2;
    }
    10% {
        opacity: 0.4;
    }
    20% {
        opacity: 0.8;
    }
    30% {
        opacity: 0.9;
    }
    40% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 1;
    }
    70% {
        opacity: 0.9;
    }
    80% {
        opacity: 0.8;
    }
    90% {
        opacity: 0.4;
    }
    to {
        opacity: 0.2;
    }
}

@-ms-keyframes fade-in-out {
    from {
        opacity: 0.2;
    }
    10% {
        opacity: 0.4;
    }
    20% {
        opacity: 0.8;
    }
    30% {
        opacity: 0.9;
    }
    40% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 1;
    }
    70% {
        opacity: 0.9;
    }
    80% {
        opacity: 0.8;
    }
    90% {
        opacity: 0.4;
    }
    to {
        opacity: 0.2;
    }
}

@keyframes fade-in-out {
    from {
        opacity: 0.2;
    }
    10% {
        opacity: 0.4;
    }
    20% {
        opacity: 0.8;
    }
    30% {
        opacity: 0.9;
    }
    40% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    60% {
        opacity: 1;
    }
    70% {
        opacity: 0.9;
    }
    80% {
        opacity: 0.8;
    }
    90% {
        opacity: 0.4;
    }
    to {
        opacity: 0.2;
    }
}
.swiper-zoom-msg.active {
    display: block;
}


/* ===== 6-6. service menu ====================================================================== */

.menuService {
    padding: 15px 0;
    background-color: #e6ecf2;
}

.serviceSns {
    margin: 15px;
}

.serviceSns p {
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.2;
    display: inline-block;
    width: 45%;
}

.serviceSns p.serviceLi {
    float: right;
    display: block;
    margin: 0 0 0 10px;
    width: 45px;
    height: 45px;
}

.serviceSns p.serviceTw, .serviceSns p.serviceFb {
    float: right;
    display: block;
    margin: 0 0 0 10px;
    width: 45px;
    height: 45px;
    border-radius: 45px;
    -webkit-border-radius: 45px;
    -moz-border-radius: 45px;
}

.serviceSns p.serviceFb {
    margin: 0 0 0 0;
}

.serviceSns p.serviceLi {
    background: url(../../../images/v2/common/icon_service_li.png) center center no-repeat;
    background-size: 45px 45px;
}

.serviceSns p.serviceTw {
    background: url(../../../images/v2/common/icon_service_tw.png) #40bff5 center center no-repeat;
    background-size: 25px 25px;
}

.serviceSns p.serviceFb {
    background: url(../../../images/v2/common/icon_service_fb.png) #3b5998 center center no-repeat;
    background-size: 25px 25px;
}

.serviceSns p.serviceLi a, .serviceSns p.serviceTw a, .serviceSns p.serviceFb a {
    width: 45px;
    height: 45px;
    display: block;
}

.serviceSearch {
    height: 30px;
    margin: 0 15px 15px;
}

.serviceSearch #popin_query {
    margin: 0;
    width: 80%;
    padding-left: 10px;
    height: 30px;
    border: 1px solid #efefef;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    background: url(../../../images/v2/common/logo_search_popin.png) #fff right 2% center no-repeat;
    background-size: 56px 15px;
}

.serviceSearch #searchbutton {
    font-size: 0;
    margin: 0;
    min-width: 20%;
    height: 30px;
    border: 1px solid #efefef;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    text-align: center;
    background: url(../../../images/v2/common/icon_search.png) #a2bed7 center center no-repeat;
    background-size: 20px 20px;
}

.serviceRelated {
    font-size: 1.2rem;
}

.serviceRelated ul {
    margin-left: 5px;
    font-size: 1.2rem;
    text-align: center;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.serviceRelated li {
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    margin: 0 5px 5px 0;
    width: 30%;
    border: 1px solid #efefef;
    background-color: #fff;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    box-shadow: rgba(0, 111, 255, 0.01) 0px 2px 6px 2px;
    -webkit-box-shadow: rgba(0, 111, 255, 0.01) 0px 2px 6px 2px;
    -moz-box-shadow: rgba(0, 111, 255, 0.01) 0px 2px 6px 2px;
}

.serviceRelated li a {
    color: #333;
    vertical-align: middle;
    padding: 10px;
    display: block;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.serviceRelated li img {
    margin: 0 auto 5px;
    height: 60px;
}

.serviceRelated li span {
    display: block;
}

.serviceRelated li:nth-of-type(n+10) {
    text-align: left;
    width: 45%;
}

.serviceRelated li:nth-of-type(n+10) img {
    margin: 0 10px 10px 0;
    float: left;
    height: 30px;
}

.serviceRelated li:nth-of-type(n+10) span {
    display: inline-block;
}

.serviceClose {
    display: none;
    font-size: 1.4rem;
    text-align: center;
    margin: 15px auto;
    font-size: 1.5rem;
}

.serviceClose span.outer {
    display: block;
    margin: 0 auto;
    width: 40%;
    text-align: center;
    vertical-align: middle;
    border: 1px solid #efefef;
    background-color: #fff;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}

.serviceClose span.inner {
    display: block;
    margin: 0 auto;
    color: #333;
    padding: 10px 20px 10px 30px;
    background: url(../../../images/v2/common/icon_btn_close.png) left 10px center no-repeat;
    background-size: 20px 20px;
}


/* for action */

#modServiceInfo .now-loading {
    -webkit-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -moz-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -o-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -ms-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    transition: height 150ms ease-out, opacity 150ms ease 100ms;
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center center;
    background-repeat: no-repeat;
    height: 60px;
}

#modServiceInfo .now-loading.ready {
    opacity: 0;
    height: 0;
    visibility: hidden;
}

#modServiceInfo #modServiceInfoBody {
    display: none;
    opacity: 0;
    -webkit-transition: opacity 80ms ease-in 50ms;
    -moz-transition: opacity 80ms ease-in 50ms;
    -o-transition: opacity 80ms ease-in 50ms;
    -ms-transition: opacity 80ms ease-in 50ms;
    transition: opacity 80ms ease-in 50ms;
}

#modServiceInfo.active .now-loading {
    display: none;
}

#modServiceInfo.active #modServiceInfoBody {
    display: block;
}

#modServiceInfo.active.fade #modServiceInfoBody {
    opacity: 1;
}

#modServiceInfo .serviceClose {
    display: block;
}


/* ===== 6-7. button press ====================================================================== */

.button-ready-animation {
    background-image: -webkit-radial-gradient(circle, rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.6), rgba(248, 248, 255, 0.8), rgba(248, 248, 255, 0.6));
    background-image: -moz-radial-gradient(circle, rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.6), rgba(248, 248, 255, 0.8), rgba(248, 248, 255, 0.6));
    background-image: -o-radial-gradient(circle, rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.6), rgba(248, 248, 255, 0.8), rgba(248, 248, 255, 0.6));
    background-image: -ms-radial-gradient(circle, rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.6), rgba(248, 248, 255, 0.8), rgba(248, 248, 255, 0.6));
    background-image: radial-gradient(circle, rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.2), rgba(248, 248, 255, 0.4), rgba(248, 248, 255, 0.6), rgba(248, 248, 255, 0.8), rgba(248, 248, 255, 0.6));
    background-repeat: no-repeat;
    background-position: center center;
    -webkit-background-size: 0 0;
    -moz-background-size: 0 0;
    background-size: 0 0;
    opacity: 0.9;
}

.button-ready-animation[data-animation-tone="soft-gray"] {
    background-image: -webkit-radial-gradient(circle, rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.6), rgba(245, 245, 245, 0.8), rgba(245, 245, 245, 0.6));
    background-image: -moz-radial-gradient(circle, rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.6), rgba(245, 245, 245, 0.8), rgba(245, 245, 245, 0.6));
    background-image: -o-radial-gradient(circle, rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.6), rgba(245, 245, 245, 0.8), rgba(245, 245, 245, 0.6));
    background-image: -ms-radial-gradient(circle, rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.6), rgba(245, 245, 245, 0.8), rgba(245, 245, 245, 0.6));
    background-image: radial-gradient(circle, rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.2), rgba(245, 245, 245, 0.4), rgba(245, 245, 245, 0.6), rgba(245, 245, 245, 0.8), rgba(245, 245, 245, 0.6));
    opacity: 0.8;
}

.button-ready-animation[data-animation-tone="dark-gray"] {
    background-image: -webkit-radial-gradient(circle, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.6), rgba(211, 211, 211, 0.8), rgba(211, 211, 211, 0.6));
    background-image: -moz-radial-gradient(circle, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.6), rgba(211, 211, 211, 0.8), rgba(211, 211, 211, 0.6));
    background-image: -o-radial-gradient(circle, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.6), rgba(211, 211, 211, 0.8), rgba(211, 211, 211, 0.6));
    background-image: -ms-radial-gradient(circle, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.6), rgba(211, 211, 211, 0.8), rgba(211, 211, 211, 0.6));
    background-image: radial-gradient(circle, rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.2), rgba(211, 211, 211, 0.4), rgba(211, 211, 211, 0.6), rgba(211, 211, 211, 0.8), rgba(211, 211, 211, 0.6));
    opacity: 0.7;
}

.button-pressed-animation {
    -webkit-animation-duration: 1s;
    -webkit-animation-name: expand;
    -moz-animation-duration: 1s;
    -moz-animation-name: expand;
    -o-animation-duration: 1s;
    -o-animation-name: expand;
    -ms-animation-duration: 1s;
    -ms-animation-name: expand;
    animation-duration: 1s;
    animation-name: expand;
}

.button-pressed {
    opacity: 0.8;
}

@-webkit-keyframes expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 200%;
        -moz-background-size: 100% 200%;
        background-size: 100% 200%;
    }
}

@-moz-keyframes expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 200%;
        -moz-background-size: 100% 200%;
        background-size: 100% 200%;
    }
}

@-o-keyframes expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 200%;
        -moz-background-size: 100% 200%;
        background-size: 100% 200%;
    }
}

@-ms-keyframes expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 200%;
        -moz-background-size: 100% 200%;
        background-size: 100% 200%;
    }
}

@keyframes expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 200%;
        -moz-background-size: 100% 200%;
        background-size: 100% 200%;
    }
}

.button-pressed-animation[data-animation-size="small"] {
    -webkit-animation-duration: 0.7s;
    -webkit-animation-name: s-expand;
    -moz-animation-duration: 0.7s;
    -moz-animation-name: s-expand;
    -o-animation-duration: 0.7s;
    -o-animation-name: s-expand;
    -ms-animation-duration: 0.7s;
    -ms-animation-name: s-expand;
    animation-duration: 0.7s;
    animation-name: s-expand;
}

@-webkit-keyframes s-expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 100%;
        -moz-background-size: 100% 100%;
        background-size: 100% 100%;
    }
}

@-moz-keyframes s-expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 100%;
        -moz-background-size: 100% 100%;
        background-size: 100% 100%;
    }
}

@-o-keyframes s-expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 100%;
        -moz-background-size: 100% 100%;
        background-size: 100% 100%;
    }
}

@-ms-keyframes s-expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 100%;
        -moz-background-size: 100% 100%;
        background-size: 100% 100%;
    }
}

@keyframes s-expand {
    from {
        opacity: 0.7;
        -webkit-background-size: 0 0;
        -moz-background-size: 0 0;
        background-size: 0 0;
    }
    to {
        opacity: 0.9;
        -webkit-background-size: 100% 100%;
        -moz-background-size: 100% 100%;
        background-size: 100% 100%;
    }
}


/* ===== 6-8. contentOpener action ==================================================================== */

.read-more .now-loading {
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center center;
    background-repeat: no-repeat;
    height: 60px;
}

.read-more .now-loading.ready {
    opacity: 0;
    height: 0;
    visibility: hidden;
}

.read-more.active .now-loading {
    -webkit-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -moz-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -o-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -ms-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    transition: height 150ms ease-out, opacity 150ms ease 100ms;
}

.read-more .more-part {
    -webkit-transition: opacity 100ms ease-in 50ms;
    -moz-transition: opacity 100ms ease-in 50ms;
    -o-transition: opacity 100ms ease-in 50ms;
    -ms-transition: opacity 100ms ease-in 50ms;
    transition: opacity 100ms ease-in 50ms;
}

.js .read-more .more-part.not-fallback {
    /*	display: none; */
    height: 0;
    overflow: hidden;
    opacity: 0;
}

.js .read-more .more-part.opened {
    /*	display: block; */
    height: auto !important;
    overflow: visible !important;
}

.js .read-more .more-part.opened.fade {
    opacity: 1;
}
.js .read-more .more-part.opened.fade ul {
	margin-top:0px;
	border-top: none;
}


/* ===== 6-9. listUpdater action ==================================================================== */

.read-continue .now-loading {
    background-image: url(../../../images/v2/common/loading.gif);
    background-position: center center;
    background-repeat: no-repeat;
    height: 60px;
}

.read-continue .now-loading.ready {
    opacity: 0;
    height: 0;
    visibility: hidden;
}

.read-continue.active .now-loading {
    -webkit-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -moz-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -o-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    -ms-transition: height 150ms ease-out, opacity 150ms ease 100ms;
    transition: height 150ms ease-out, opacity 150ms ease 100ms;
}

.read-continue .update-part {
    -webkit-transition: opacity 100ms ease-in 50ms;
    -moz-transition: opacity 100ms ease-in 50ms;
    -o-transition: opacity 100ms ease-in 50ms;
    -ms-transition: opacity 100ms ease-in 50ms;
    transition: opacity 100ms ease-in 50ms;
    opacity: 0;
    display: none;
}

.read-continue .update-part.opened {
    display: block;
}

.read-continue .update-part.fade {
    opacity: 1;
}


/* ===== 6-10. search ==================================================================== */

#popInSearchField {
    margin: 10px;
}

#popin_content ul li#continueli {
    padding: 20px 15px 30px;
}

#popin_message {
    font-size: 1.5rem;
    margin: 50px auto;
}


/* ===== 6-11. video ====================================================================== */

article video {
    display: block;
    margin: 15px auto;
    text-align: center;
    width: 320px;
    height: 240px;
}

article video source {
    width: 100%;
    height: 100%;
}


/* ===== 6-12. english template ====================================================================== */

.contentBox.english {
    word-wrap: break-word;
}

.contentBox.english .switchView li {
    width: 100%;
}

/* ===== 6-13. top module youtube ====================================================================== */

#topMovie{
    margin: 45px auto;
    border-top: 1px solid #014e94;
    position: relative;
}
#topMovie h1{
    font-size: 16px;
    font-size: 1.6rem;
    font-weight: 700;
    position: absolute;
    top: -14px;
    padding: 5px 10px 0;
    margin: 0 10px;
    color: #666;
		background: #fff;
}
.youtubeIcon{
    position: absolute;
    top: -14px;
    right: 0;
    padding-right: 10px;
    margin: 0 10px;
    width: 65px;
    height: 25px;
    background: #fff url(/smp/apr_news/images/v2/common/logo_youtube_top.png) center 50% no-repeat;
    background-size: auto 25px;
}

#topMovie .modYoutube {
	position: relative;
	height:0;
	margin :20px auto 30px;
	width:100%;
	max-width: 500px;
	padding-bottom:56.25%;
}
#topMovie .modYoutube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
