@charset "utf-8";

/* responsible.css
==================================================
 File Index
--------------------------------------------------
	Temporary Style etc.
	Inpage
	Hide Control
	Clear Base
	Layout

================================================== */



/* Temporary Style etc.
-------------------------------------------------- */
body div#slidepress_alt { margin-left: 0 }

/* for Android (over 4.0) Line Break Bug */
/*
* { background-color: rgba(255,255,255, .01) } */
* { background-color: inherit }
#topimage-navi span { background-color: transparent }

/* Clearfix
xxxxxxxxxx::after { display: table; clear: both; content: " " }

/* Ellipsis
xxxxxxxxxx { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }



/* Inpage
-------------------------------------------------- */
#top #contents #main { padding: 0 }

#panoDIV { width: 100%; height: auto }



/* Hide Control
-------------------------------------------------- */

/* _____ Top _____ */
.main_contents .main_contents_box .main_txt_box .main_txt_category,/*
.main_contents .main_contents_box .main_txt_box .main_txt_copy,
#top #contents #main #top_tab_wrp .section_wrp .section_box .section_txt, */
#top #side_category { display: none }

#related_article,
.other_contents,
.pic_img_txt { display: none }
/* Check Page's Lead
.pic_img_txt                <- en/features/c00712/
.pic_img_txt.auto_height    <- ja/in-depth/a00101/
.pic_img_txt.auto_height_mb <- en/in-depth/a01003/ */
.detail_maintit + .pic_img_txt,
#images .images_f_l_wrap #related_article, /* for No Side column @ images */
#images .images_f_l_wrap .other_contents,
#images .images_f_l_wrap .pic_img_txt.auto_height_mb { display: block }

#youtube-channel,
#side_contents_keyword,
#side_editor,
#side_features,
#side_category + .text-3,
#side_yahoo,
#side_other_colums { display: none }
#top #side_features { display: block }

#footer #navi,
#footer #footer_en .footer_social,
#footer #footer_en .footerend_banner li:first-child { display: none }



/* Clear Base
--------------------------------------------------
	Min Width
	Width
	Height
	Float
	Position
-------------------------------------------------- */


/* _________________________ Min Width */

/* _____ Top _____ */
#top #main_img,

#wrapper,
#navi,
#footer { min-width: 0 }


/* _________________________ Width */

/* _____ Top _____ */
#top #contents,
#top #contents #main,
.main_contents .main_contents_box,
.main_contents .main_contents_box .main_photo_box,
.main_contents .main_contents_box .main_txt_box,
#main_img_sum,
#main_img_sum #main_img_sum_contents,
#top #second_navi #second_navi_contents,
#top #contents #main #top_maintab ul,
#top #contents #main #top_tab_wrp .section_wrp .section_box dl dd,
#top_page_navi .page_navi { width: auto }

#header #header_contents,

#navi #navi_contents { width: auto }

#contents,
#contents #main,
#contents #main .con_box dl.list_box dd.list_box_c p.w450,
#contents #main .con_box dl.list_box dd.list_box_c .images_main_box { width: auto }

.w340,
.w458,
.w460,
.layout_two,
.pic_img_txt .w460,
.page_navi dl { width: auto }

#interview_prof .txt_interview,
#author .author_main_prof dl dd,
#author #author_contents .author_box li,
#author #author_contents .author_box dl dd,
#images #auth_profile_box { width: auto }

#contents #side,
#contents #side #side_columnist ul li p,
.ar #contents #side #side_columnist ul li p,
#contents #side #this_series_articles ul ul li a,
#contents #side #side_editor .side_contents_tit .fl,
#contents #side #this_other_articles ul ul li a { width: auto }

#footer #footer_contents,
#footer #footer_en #footer_navi { width: auto }


/* _________________________ Height */

/* _____ Top _____ */
#top #second_navi #second_navi_contents,
#top #main_img_wrp,
.main_contents .main_contents_box,
.main_contents .main_contents_box .main_photo_box,
.main_contents .main_contents_box .main_txt_box,
#main_img_sum,
#top #contents #main #top_maintab ul { height: auto }

#header #header_contents,

#navi #navi_contents { height: auto }


/* _________________________ Float */

/* _____ Top _____ */
.main_contents .main_contents_box .main_photo_box,
.main_contents .main_contents_box .main_txt_box,
.ar .main_contents .main_contents_box .main_photo_box,
.ar .main_contents .main_contents_box .main_txt_box,
#top #contents #main,
#top #contents #main #top_tab_wrp .section_wrp .section_box dl dd,
#top.ar #contents #main #top_tab_wrp .section_wrp .section_box dl dd { float: none }

#contents #main,
#contents #main .con_box dl.list_box dd.list_box_c p.w450,
#contents #main .con_box dl.list_box dd.list_box_c .fr,
.ar #contents #main,
.ar #contents #main .con_box dl.list_box dd.list_box_c p.w450,
.ar #contents #main .con_box dl.list_box dd.list_box_c .fr { float: none }

.photo_box_l,
.photo_box_r,
.w460,
.pic_img_txt .w460,
#main #recent_features dd p,
#interview_prof .txt_interview,
.ar #interview_prof .txt_interview,
#author .author_main_prof dl dd,
#author #author_contents .author_box li,
#author #author_contents .author_box dl dd,
#author.ar #author_contents .author_box dl dd,
#author.ar .author_main_prof dl dd { float: none }

#contents #side,
#contents #side #side_columnist ul li p,
.ar #contents #side,
.ar #contents #side #side_columnist ul li p { float: none }

#footer #footer_en #footer_navi,
.ar #footer #footer_en #footer_navi { float: none }

/* _________________________ Position */

/* _____ Top _____ */
#top #main_img #second_navi #second_navi_contents li { position: static; overflow: hidden }
#top #main_img #second_navi #second_navi_contents li img { position: relative; margin: -4px 0 }

#header #header_contents #logo,
#header #header_contents #header_side,
#navi #navi_contents li { position: static }
#header #header_contents #header_side .newsletter { position: absolute; right: 20px; top: 25px; }


/* Layout
--------------------------------------------------
	Base
	Top
	Header
	Global Navigation
	Main
	Side
	Footer
-------------------------------------------------- */


/* _________________________ Base */
body { -webkit-text-size-adjust: 100% }

* { max-width: 100% }
img { width: auto; height: auto;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box }

#detail_contents table th,
#detail_contents table td { padding: 10px 8px }

/* _________________________ Top */
.main_contents .main_contents_box .main_photo_box img { width: 100% }
.main_contents .main_contents_box .main_txt_box { padding: 0 10px 10px }
.main_contents .main_contents_box .main_txt_box .main_txt_title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
	margin: .75em 0 .5em }
.main_contents .main_contents_box .main_txt_box .main_txt_copy { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#main_img_sum { background-repeat: repeat }
#main_img_sum #main_img_sum_contents ul { padding-right: 6px }
#main_img_sum #main_img_sum_contents ul li { margin: 0 0 4px 6px }

#top #contents { padding: 0 0 30px }
#top #contents #main #top_maintab ul    { padding-left: 5px }
#top.ar #contents #main #top_maintab ul { padding-left: 0; padding-right: 5px }
#top #contents #main #top_maintab ul li { margin: 0 5px 5px 0; padding: .25em; background: #fff;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
#top #contents #main #top_maintab ul li:hover,
#top #contents #main #top_maintab ul li.active { background: #6e6e6e }
#top #contents #main #top_maintab ul li span,
#top #contents #main #top_maintab ul li:hover span,
#top #contents #main #top_maintab ul li.active span { padding: 0; background: 0 }

#top #contents #main #top_tab_wrp .section_wrp .section_box dl::after { display: none }
#top #contents #main #top_tab_wrp .section_wrp .section_box dl dt    { margin-left:  1em }
.ar#top #contents #main #top_tab_wrp .section_wrp .section_box dl dt { margin-right: 1em; margin-left: 0 }
//#top #contents #main #top_tab_wrp .section_wrp .section_box dl dd { white-space: nowrap }
//#top #contents #main #top_tab_wrp .section_wrp .section_box dl dd p { overflow: hidden; text-overflow: ellipsis }
#top #contents #main #top_tab_wrp .section_wrp .section_box dl dd .section_main_tit { font-size: 18px }

#top_page_navi { padding: 10px 10px 45px }
#top_page_navi .page_navi { padding: 0 }
.ar #top_page_navi .page_navi { padding: 0 }

#top.ar #contents #side { clear: both; float: none }

#top #footer { margin-top: 0 }

/* _________________________ Header */
#header #header_contents { padding: 5px 10px }
#header #header_contents #logo { margin-bottom: 8px }
#header #header_contents #header_side { margin-bottom: 4px; text-align: right }
#header #header_contents #header_side p { padding: 0; line-height: 1.8 }
#header #header_contents #header_side p a { display: inline-block; margin-left: .65em }
#header #header_contents #header_side p strong { display: inline-block; padding: 0 .65em; color: #333; cursor: default }
#header #header_contents #header_side p .line_red { display: none }
.ar #header #header_contents #header_side { text-align: left }
.ar #header #header_contents #header_side p a { margin-left: 0;   margin-right: .65em }
#header_contents #header_social { position: relative; top: auto; right: auto; }

/* _________________________ Global Navigation */
    #navi #navi_contents { padding: 2px 8px 5px 0 }
.ar #navi #navi_contents { padding: 2px 0 5px 8px }
    #navi #navi_contents li { float: left;  margin: 5px 7px 0 8px }
.ar #navi #navi_contents li { float: right; margin: 5px 8px 0 7px }

#second_navi #second_navi_contents { padding: 3px 8px 3px 0; height: auto }
#second_navi #second_navi_contents::after { display: table; clear: both; content: " " }
#second_navi #second_navi_contents li { float: left; margin: 0 7px 0 8px }
.ar #second_navi #second_navi_contents { padding: 2px 0 2px 8px }
.ar #second_navi #second_navi_contents li { float: right; margin: 0 8px 0 7px }

/* _________________________ Main */
#contents { padding: 0 0 30px }

#main_detail { margin-top: 8px; height: auto; min-height: 0; text-align: center }
#main_detail img { position: static }

#contents #main { padding: 0 10px }
#contents #main .con_box dl.list_box dd .list_box_sub_img,
#contents #main .con_box dl.list_box dd .list_box_main_img { max-width: 40% }
#contents #main .con_box dl.list_box dd.list_box_c p.w450,
#contents #main .con_box dl.list_box dd.list_box_c .fr { overflow: hidden }
#contents #main .con_box dl.list_box dd.list_box_c p a { display: inline-block; padding-bottom: 0; overflow: hidden;
	text-overflow: ellipsis; white-space: nowrap }

#contents #main .page_top { float: right }
#contents #main #pager { clear: none }
#contents #main #pager table { margin: 0 }

#detail_contents .alignleft, /* for fancybox ? */
#detail_contents .alignright { float: none; margin: 0 auto .25em }

.photo_box, .photo_box_r, .photo_box_l {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
	margin: 0 auto 2em }
#detail_contents img { display: block; margin: 0 auto .75em }
#detail_contents img[style*="margin-left"] { margin-left: auto !important }
#detail_contents img[style*="margin-right"] { margin-right: auto !important }
#detail_contents a.fancybox { display: block; margin: 0 auto .25em }
#detail_contents .photo_box_c a.fancybox,
#detail_contents .photo_box_r a.fancybox,
#detail_contents .photo_box_l a.fancybox { display: inline }
#detail_contents .photo_box_c a.fancybox img,
#detail_contents .photo_box_r a.fancybox img,
#detail_contents .photo_box_l a.fancybox img { display: inline; vertical-align: bottom }
.photo_box_c { width: auto !important }
.pic_img_txt img { margin: 10px 0 }
.pic_img_txt p { overflow: hidden }
#main #auth_profile_box > .fl { margin-right: -70px; max-width: 70px }
#main #auth_profile_box > .fr { margin-left: 84px; width: auto }
#main #auth_profile_box img.fl[width="70"] { width: 70px }
.ar #main #auth_profile_box > .fl { margin-right: 0; margin-left: -98px }
.ar #main #auth_profile_box > .fr { margin-left: 0; margin-right: 108px }
#main #recent_features dd img { max-width: 20%; padding-right: .5em }
#main .other_contents #recent_features dd p { padding: 12px 10px 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
.images_f_l_wrap,
.images_f_l_wrap .media_list, .images_f_l_wrap .images_reed,
.images_f_l_wrap #detail_contents, .images_f_l_wrap .author_txt { width: auto !important }
#author .author_main_prof dl dd { overflow: hidden }
#author .author_main_prof dl dd .author_data { clear: none }

.layout_two_wake { display: table; float: none; margin: 0 auto; width: auto !important }
.ar .layout_two_wake { float: none }
.layout_two_wake img { display: block; margin: 0 auto }
#contents #main .con_box dl.list_box dt,
#contents #main .con_box dl.list_box dd.list_box_c { height: auto !important }
#contents #main .con_box dl.list_box dd.list_box_c p.m_b10 { overflow: hidden }
#contents #main .con_box dl.list_box dd.list_box_c p.m_b10 img  { display: block; margin: 0 auto }
#contents #main .con_box dl.list_box dd.list_box_c .images_main_box { float: left; padding: 0 10px 0 0; max-width: 50%; height: auto }
#contents #main .con_box dl.list_box dd.list_box_c .images_main_box span.img { top: 50%; left: 50%; margin: -30px 0 0 -30px }

#more_photo_gallery div.scrollableArea img { max-height: 80px }

#interview_prof .txt_interview { overflow: hidden }

#contents #main .list_box_rline_none { border-right-width: 1px !important; width: auto !important }
#features #contents #main .list_box_line_bottm_s { padding: 5px; padding-top: 5px !important }

#author #author_contents .author_box { padding-bottom: 0 }
#author #author_contents .author_box li { margin-bottom: 1em }
#author #author_contents .author_box dl dd { padding-left: 10px; overflow: hidden }
#author.ar #author_contents .author_box dl dd { padding-left: 0; padding-right: 10px }
#author #author_contents .author_box li .author_disc { min-height: 0 }

#author .author_main_prof { padding: 14px }
#author .author_main_prof dl dt { width: 112px }

/* _________________________ Side */
#contents #side .side_article::after { display: table; clear: both; content: " " }

#contents #side #side_popularity .side_article_data .detail { min-height: 1em }

#side_contents_photo_kizi #side_con_photo_wrp { height: auto }
#side_contents_photo_kizi #side_con_photo_wrp div a img { width: 200px; height: 85px }
#side_contents_photo_kizi #side_con_photo_wrp div span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap }
#side_contents_photo_kizi .side_con_photo_navi,
.ar #side_contents_photo_kizi .side_con_photo_navi { margin: 0 auto; width: 200px }

#contents #side #side_columnist ul { padding: 5px; padding-bottom: 0 }
#contents #side #side_columnist ul::after { display: table; clear: both; content: " " }
#contents #side #side_columnist ul li { clear: none; float: left; padding-bottom: 5px; width: 20% }
#contents #side #side_columnist ul li::after { display: none }
#contents #side #side_columnist ul li p { padding: 0 .6em 0 .4em; overflow: hidden }
.ar #contents #side #side_columnist ul li p { padding: 0 .4em 0 .6em }
.ar #contents #side #side_category ul li { float: right }

#contents #side #side_category ul li { width: 25% }

#contents #side #side_yahoo ul li { position: relative; left: 1.5em; float: left; margin-left: 0; padding: 0 1.5em 2px 0; width: 50%;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box }
#contents #side #side_yahoo ul li a { display: list-item }

/* _________________________ Footer */
#footer { border-top: 2px solid #6D6D6D }
#footer #footer_en { padding-top: 5px }
#footer #footer_en #footer_navi a { display: inline-block; padding: .25em .5em; margin-right: 1em }
#footer #footer_en #footer_navi span { display: none }
#footer #footer_en #footer_navi p { /*float: left;*/ margin: 10px 5px 0 }
#footer #footer_en .footer_aside { float: none; }
#footer #footer_en .footer_social { float: right; margin: 10px 5px 0 0 }
#footer #footer_en .newsletter { margin-left: 5px; }
#footer #footer_en .newsletter a { float: none; ; }
#footer #footer_en .footerend_banner ul li { padding: 0 0 0 8px }
#footer #footer_en .footerend_banner { padding-top: 20px }
.ar #footer #footer_en .footer_social { float: left; width: auto; margin: 10px 0 0 5px }
.ar #footer #footer_en #footer_navi p { float: right }
.ar #footer #footer_en .footerend_banner ul li { padding: 0 8px 0 0 }

/* _________________________ ｘｘｘｘｘ */

/* _____ ｘｘｘｘｘ _____ */