@charset "utf-8";

@import "/Portals/0/css/base.css";
@import "/Portals/0/css/contents.css";
@import "/Portals/0/css/contents_res.css";
@import "/Portals/0/css/contents_old.css";

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

/*  SPU ----- skin */

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

/* ===========================================================
	html
=========================================================== */
html,
body{min-width:1025px;font-size:16px;font-weight:500;line-height:1.8;color:#000;}
body{font-family:"游ゴシック", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;font-size:100%;}
.spMode html,
.spMode body{font-size:13px;-webkit-text-size-adjust:none;font-family:"Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Roboto", "Droid Sans", "Meiryo", "sans-serif";}
.spMode body{font-size:100%;}

.tbMode html,
.tbMode body{-webkit-text-size-adjust:none;font-family:"Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "Roboto", "Droid Sans", "Meiryo", "sans-serif";}
.tbMode body{font-size:100%;}

.tbArea{display:none;}
.pcArea{display:block;}
.spArea{display:none;}

/* ===========================================================
	skin
=========================================================== */
.animSet.skinIndex{-webkit-transition:padding-right 0.3s ease-out;transition:padding-right 0.3s ease-out;}
#skin.navOpen{padding-right:240px;}
#blockskip{display:none;}
.inner{max-width:1060px;margin:0 auto;padding:0 30px;}
.DNNEmptyPane{margin:0 !important;padding:0 !important;}

/* ===========================================================
	headBody
=========================================================== */
#header{margin:0;padding:0;width:240px;height:100%;background-color:rgba(255,255,255,0.95);position:fixed;top:0;right:-240px;z-index:90;}
.animSet #header{-webkit-transition:right .3s ease-out;transition:right .3s ease-out;}
.navOpen #header{right:0;}

/* logo */
.logo{margin:20px 0;padding:0;font-size:0;line-height:1;text-align:center;}
.logo a{display:inline-block;}

/* headMiddle */
.headBtnWrap:after{content:"";display:block;clear:both;}
.headBtnWrap > *{float:left;}
.headBtnWrap > * p{margin:0;padding:0;}
.headBtnWrap > * a,
.headBtnWrap > * span{display:block;overflow:hidden;height:100%;white-space:nowrap;text-indent:200%;}
.langLink{width:120px;height:50px;margin:0;padding:10px 0 0;border-top:1px solid #ccc;background:url(images/ttl_language.png) no-repeat center 35px;text-align:center;letter-spacing:-0.4em;}
.langLink li{display:inline-block;list-style:none;margin:0;padding:0;letter-spacing:normal;}
.langLink li.langJP a,
.langLink li.langJP span{width:50px;height:20px;background:url(images/btn_language.png) no-repeat 0 0;}
.langLink li.langEN a,
.langLink li.langEN span{width:50px;height:20px;background:url(images/btn_language.png) no-repeat -50px 0;}
.langLink li a:hover{background-position-y:-20px;}
.jp .langLink li.langJP a,
.jp .langLink li.langJP span{background-position-y:-20px;}
.en .langLink li.langEN a,
.en .langLink li.langEN span{background-position-y:-20px;}
.accessBtn,
.searchMotionBtn{width:60px;height:50px;border-top:1px solid #ccc;border-left:1px solid #ccc;}
.jp .accessBtn{background:url(/Portals/0/Skins/SPU/images/btn_access.png) no-repeat center;}
.en .accessBtn{background:url(/Portals/0/Skins/SPU-en/images/btn_access.png) no-repeat center;}
.jp .searchMotionBtn{background:url(/Portals/0/Skins/SPU/images/btn_search.png) no-repeat center;}
.en .searchMotionBtn{background:url(/Portals/0/Skins/SPU-en/images/btn_search.png) no-repeat center;}
.accessBtn:hover,
.searchMotionBtn:hover{background-color:#ffe5cc;cursor:pointer;}

.headSearchWrap{display:none;margin:0;padding:10px;background:#ff7d00;}
.ExternalSearchBox.searchWrap{position:relative;width:100%;height:30px;background:#fff;line-height:30px;}
.ExternalSearchBox.searchWrap input{border:none;}
.ExternalSearchBox.searchWrap input[type="text"]:focus{outline:none;}
.ExternalSearchBox.searchWrap input.txtSearch{width:100%;margin:0;padding:0 30px 0 10px;}
.ExternalSearchBox.searchWrap input.searchBtn{overflow:hidden;position:absolute;top:0;right:0;width:30px;height:30px;background:url(/Portals/0/images/common/ico_magnify.png) center center no-repeat;background-size:14px;white-space:nowrap;text-indent:200%;}
.ExternalSearchBox.searchWrap span.placeholder{display:block;position:absolute;top:0;left:0;width:100%;height:30px;margin:0;padding:0 30px 0 10px;color:#000;line-height:30px;}
.ExternalSearchBox.searchWrap span.placeholder{font-size:100%;}/* iPhoneのズーム回避 */
.ExternalSearchBox.searchWrap + iframe{display:none;}

/* ===========================================================
	content
=========================================================== */
#main{height:100%;margin:0 0 8em;padding:0;}
.breadcrumb{margin:0;padding:8px 20px;font-size:88%;}
.breadcrumb a{color:#000;text-decoration:none;}
.breadcrumb a:hover{color:#000;text-decoration:underline;}
.breadcrumbLine{margin:0 0.2em;color:#ee5400;}
.en .breadcrumb > span{margin:0 0 0 -200px;}
.en .breadcrumb > span > a:first-child,
.en .breadcrumb > span > a:first-child + span{display:none;}
.en .breadcrumb > span > a:first-child + span + a{margin:0 0 0 200px;}
.spMode .breadcrumb{padding:5px 60px 5px 10px;}

/* ===========================================================
	footBody
=========================================================== */
#footer{margin:0;padding:0;}
.footTop{margin:0;padding:0;border-top:5px solid #ff7d00;background:#eee;}
.pagetop a{display:block;overflow:hidden;position:fixed;right:240px;bottom:0;width:120px;height:40px;background:url(images/btn_pagetop.png) 0 0 no-repeat;white-space:nowrap;text-indent:200%;}
.pagetop a:hover{background-position-y:-40px;}
.footBottom{margin:2em 0;padding:0 20px;}
.copyright{margin:1em 0 2em;padding:0;color:#666;font-size:69%;line-height:1.2;text-align:center;}
.spMode .pagetop a:hover{background-position-y:-0;}
.spMode .footBottom{margin:1em 0;}

/* ===========================================================
	css for each skin
=========================================================== */
#skin.skinIndex #main{margin:0;}

/* ===========================================================
	css for admin
=========================================================== */
.adminMode #header{position:absolute !important;}
.adminMode .headSearchWrap{display:block !important;}
.adminMode[data-view="pc"] #skin.skinIndex .burgerMotion{display:none !important;}
.adminMode[data-control="normal"][data-view="pc"] #skin{padding-right:240px !important;}
.adminMode[data-control="normal"][data-view="pc"] #skin #header{right:280px !important;}
.adminMode[data-control="minimum"][data-view="pc"] #skin{padding-right:290px !important;}
.adminMode[data-control="minimum"][data-view="pc"] #skin #header{right:50px !important;}

.previewMode[data-control="normal"][data-view="pc"] #skin #header{right:40px;}
.previewMode[data-control="normal"][data-view="pc"] #skin.navOpen #header{right:280px;}
.previewMode[data-control="minimum"][data-view="pc"] #skin.navOpen{padding-right:290px;}
.previewMode[data-control="minimum"][data-view="pc"] #skin #header{right:-190px;}
.previewMode[data-control="minimum"][data-view="pc"] #skin.navOpen #header{right:50px;}

/* css-for-filemanager */
.FileManager #tdGrid{border-right:1px solid #696969;}
.FileManager_RightBox{border-right:1px solid #000;}
.FileManager_LeftBox{width:200px !important;}
.FileManager_LeftBox img{height:13px !important;}
#dnn_ctr362_ModuleContent table{width:100% !important;}
#dnn_ctr362_ModuleContent table td{text-align:left !important;}

/* 編集ナビ */
.ModuleTitle_MenuContainer > tbody > tr > td,
.ModuleTitle_MenuContainer > tbody > tr > td > table{width:auto;}
.ModuleTitle_MenuContainer > tbody > tr > td > table img{max-width:inherit;}
.ModuleTitle_MenuContainer > tbody > tr td:last-child{line-height:1;}
.ModuleTitle_MenuItem{font-size:12px !important;}

/* 編集ナビの更新日付 */
.EditNaviTitle{width:62px !important;padding-right:5px;}
.CMUpdateDatetime{color:#333;font-weight:normal;font-size:13px;line-height:1.2;}

/* コンパネのH2 */
.controlPanel h2:before{display:none;}

/* コンパネのリンクチェックボタン */
.controlPanelBody .iconMenu li.btn_linkchk{font-size:11px;letter-spacing:-0.5px;}
.controlPanelBody .iconMenu li.btn_linkchk a{background:url(/Portals/0/images/common/ico_panelpage_linkcheck.png) center 8px no-repeat;}
.controlPanelBody .iconMenu li.btn_linkchk a:hover{background-color:#333;background-image:url(/Portals/0/images/common/ico_panelpage_linkcheck_hover.png);}
.controlPanelBody .iconMenu li.btn_linkchk a[disabled="disabled"]{background-image:url(/Portals/0/images/common/ico_panelpage_linkcheck_disabled.png);}

/* スマホプレビュー */
.selectBox + .fancybox-wrap,
.selectBox + .fancybox-wrap *{box-sizing:content-box !important;}
.previewMode .fancybox-opened{z-index:99999999 !important;}
.controlPanelBody .ControlPanel_View span a[disabled=true],
.minimum .controlPanelBody .ControlPanel_View span a[disabled=true]{display:none;}/* ボタン非表示 */

/* 見出し */
[id$="_lblTitle"]{display:inline-block;font-weight:bold;}
[id$="_pnlRule"] hr{height:3px;margin:0.5em 0 2em;padding:0;background:#e6e6e6;border:none;}

/* お知らせ表示の設定 */
table.TblManagedModuleDetailPage td{width:40%;vertical-align:top;}
table.TblManagedModuleDetailPage td:first-child{width:60%;}
table.TblManagedModuleDetailPage td select{width:100%;}

/* リッチテキストエディタ */
.EditContent a[title="フォント名"],
.EditAnnouncements a[title="フォント名"],
.EditProducts a[title="フォント名"],
.EditContent a[title="サイズ"],
.EditAnnouncements a[title="サイズ"],
.EditProducts a[title="サイズ"],
.EditContent a[title="絵文字挿入"],
.EditAnnouncements a[title="絵文字挿入"],
.EditProducts a[title="絵文字挿入"]{display:none;}

/* ページヘッダー設定 */
#dnn_ctr374_ViewUrlCustomize_grdUrlCustomize img{max-width:none;}


/*******************************************************************************

	tablet

*******************************************************************************/
@media screen and (max-width:1025px){
/* ===========================================================
	html
=========================================================== */
	html,
	body{min-width:inherit;}

	.pcArea{display:none;}
	.tbArea{display:block;}
	.spArea{display:none;}

/* ===========================================================
	skin
=========================================================== */
	#skin{padding-right:0;}
	#skin.navOpen{padding-right:0;}
	.inner{padding:0 30px;max-width:100%;}

/* ===========================================================
	headBody
=========================================================== */
	#header{overflow:auto;right:0;height:auto;max-height:100%;z-index:1000;width:60%;}
	.navOpen #header{}
	.adminMode #header{position:fixed !important;}
	#header .headMiddle{display:none;border-top:50px solid #ff7d00;}
	#header .headBottom{display:none;}

/* logo */
	.logo{display:none;}

/* headMiddle */
	.headBtnWrap > *{width:50%;}
	.accessArea .accessBtn{text-align:center;}
	.accessArea .accessBtn a:before{content:"";display:inline-block;width:18px;height:18px;margin-right:5px;background:url(images/btn_access_sp.png) no-repeat 0 0;background-size:auto 100%;vertical-align:middle;}
	.headBtnWrap > * a,
	.headBtnWrap > * span{display:block;overflow:visible;width:100%;height:40px;background:none;font-size:13px;line-height:40px;text-decoration:none;white-space:normal;text-indent:0;}
	.langLink{width:100%;height:40px;padding:0;border-top:none;background:none;}
	.jp .langLink li.langJP,
	.en .langLink li.langEN{display:none;}
	.langLink li{display:block;}
	.langLink li.langJP a,
	.langLink li.langJP span,
	.langLink li.langEN a,
	.langLink li.langEN span{width:100%;height:40px;background:none;}
	.langLink li.langJP a:before,
	.langLink li.langJP span:before,
	.langLink li.langEN a:before,
	.langLink li.langEN span:before{content:"";display:inline-block;width:18px;height:18px;margin-right:10px;background:url(images/btn_language_sp.png) no-repeat 0 0;background-size:100% auto;vertical-align:middle;}
	.accessBtn,
	.searchMotionBtn{width:100%;height:40px;border-top:none;}
	.jp .accessBtn,
	.en .accessBtn{background:none;}
	.searchArea{display:none;}
	.headSearchWrap{display:block;position:absolute;top:0;left:0;width:calc(100% - 50px);padding:10px 0 10px 10px;}

/* ===========================================================
	content
=========================================================== */
	.breadcrumb{padding-right:60px;}

/* ===========================================================
	footBody
=========================================================== */
	.pagetop a{right:0;}
}


/*******************************************************************************

	smartphone

*******************************************************************************/
@media screen and (max-width:767px){
/* ===========================================================
	html
=========================================================== */
	html,
	body{min-width:320px;}

	.pcArea{display:none;}
	.tbArea{display:none;}
	.spArea{display:block;}

/* ===========================================================
	skin
=========================================================== */
	.inner{padding:0 20px;}

/* ===========================================================
	headBody
=========================================================== */
	#header{width:100%;}

/* ===========================================================
	footBody
=========================================================== */
	.pagetop a{right:10px;bottom:40px;}
}