@charset "utf-8";

@import "/Portals/0/css/module.css";
@import "/Portals/0/responsive/css/base.css";
@import "/Portals/0/responsive/css/contents.css";
@import "/Portals/0/responsive/css/contents_old.css";
@import "/Portals/0/responsive/css/contents.css";

/* ===========================================================
 html
=========================================================== */
/* size settings */
html,
body{min-width:1100px;}

/* font settings */
html,
body{color:#333;font-size:14px;line-height:1.8;}
body{font-family:"Meiryo","Verdana","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Osaka","ＭＳ Ｐゴシック","sans-serif";}

/* pc/sp settings */
.pcArea{display:block;}
.spArea{display:none;}

/* font-size */
body.fontSize1{font-size:85.7%;}
body.fontSize2{font-size:100%;}
body.fontSize3{font-size:114.3%;}

/* ===========================================================
 skin
=========================================================== */
#blockskip{display:none;}
.inner{width:1060px;margin:0 auto;}
.DNNEmptyPane{margin:0 !important;padding:0 !important;}

#skin{padding:80px 0 0;}

/* ===========================================================
 headBody
=========================================================== */
.header{position:fixed;top:0;z-index:91;width:100%;min-width:1060px;min-height:80px;margin:0;padding:0;box-shadow:0 0 4px 0 rgba(0,0,0,0.5);background-color:#fff;}
.headTop{display:flex;position:relative;width:100%;padding:0 30px 0 30px;transition:left 0.3s;flex-wrap:nowrap;justify-content:space-between;align-items:flex-start;}
.headTop .left{}
.headTop .right{display:flex;flex-wrap:nowrap;justify-content:flex-end;align-items:center;}
.headTop .right .burgerWrap{display:flex;padding:0;flex-wrap:nowrap;justify-content:flex-end;align-items:center;}
.headTop .right .burgerWrap > div:not(.burgerMotion){margin-left:25px;}
.headTop .right .burgerWrap > ul:first-of-type{margin-left:0;}
.headBottom{display:none;}

/* logo */
.logo{margin:0;padding:18px 0 17px;}
.logo a{display:block;transition-duration:0.3s;transition-property:all;}
.logo a:hover{opacity:0.7;}
.logo a img{display:block;}

/* fontSizer */
#fontSizer{display:flex;position:relative;margin:0;padding:4px 0 4px 53px;flex-wrap:wrap;justify-content:space-between;align-items:center;}
#fontSizer:before{content:"テキスト";display:block;position:absolute;top:0;bottom:0;left:0;width:53px;margin:auto;padding:6px 0 0;color:#333;font-size:0.929rem;text-align:left;}
#fontSizer li{display:block;list-style-type:none;width:24px;height:24px;margin:0 0 0 4px;padding:0;border:none;border-radius:12px;background:#bbb;color:#fff;font-size:0.929rem;line-height:1;line-height:24px;text-align:center;letter-spacing:normal;transition-duration:0.3s;transition-property:all;}
#fontSizer li:hover{cursor:pointer;}
#fontSizer li:hover,
#fontSizer li.active,
#fontSizer li.defaultFont{background:#da0019;color:#fff;}

/* searchWrap */
.searchWrap{position:relative;width:180px;height:30px;margin:0;border:none;}
.searchWrap input[type="text"]{position:absolute;top:0;left:0;width:180px;height:auto;min-height:30px;margin:0;padding:3px 40px 3px 5px;border:1px solid #000;border-radius:4px;outline:none;font-size:1rem;line-height:14px;}
.searchWrap a{display:block;overflow:hidden;position:absolute;top:0;right:0;bottom:0;width:30px;height:30px;border:none;border-radius:0 4px 4px 0;background:#555;color:transparent;white-space:nowrap;text-indent:200%;transition-duration:0.3s;transition-property:all;}
.searchWrap a:hover{background-color:#999;}
.searchWrap a::before{content:"";display:block;position:absolute;top:7px;left:7px;width:13px;height:13px;margin:auto;border:2px solid #fff;border-radius:7px;background-color:transparent;}
.searchWrap a::after{content:"";display:block;position:absolute;top:16px;left:19px;transform:rotate(-45deg);width:2px;height:7px;margin:auto;border-radius:2px;background-color:#fff;}

/* ===========================================================
 gNav
=========================================================== */
#gNav{display:none;margin:0 auto;padding:0;}

.tokenMenu ul{margin:0;padding:0;}
.tokenMenu li{display:none;list-style-type:none;margin:0;padding:0;}
.tokenMenu ul ul{display:none;}

/* ===========================================================
 burger
=========================================================== */
.burgerMotion{z-index:15;width:40px;height:80px;margin-left:50px;padding:27px 5px 26px;cursor:pointer;}
.burgerMotion p{position:relative;width:100%;height:27px;margin:0 auto;padding:0;}
.burgerMotion p span{display:inline-block;position:absolute;top:0;bottom:0;width:100%;height:3px;margin:auto;background-color:#c6151c;transition:background 0.2s;}
.burgerMotion.active p span{background-color:rgba(255, 255, 255, 0);}
.burgerMotion p span:before,
.burgerMotion p span:after{content:"";display:block;position:absolute;right:0;left:0;width:100%;height:3px;margin:auto;background-color:#c6151c;-webkit-transition:all 0.2s;transition:all 0.2s;}
.burgerMotion p span:before{margin-top:-12px;}
.burgerMotion p span:after{margin-top:12px;}
.burgerMotion.active p span:before{transform:rotate(45deg);margin-top:0;}
.burgerMotion.active p span:after{transform:rotate(-45deg);margin-top:0;}
.overlay{position:fixed;top:0;left:0;z-index:90;width:100%;background-color:rgba(0,0,0,0.75);cursor:pointer;}
.burgerCloseMotion{display:none;}

/* ===========================================================
 skinIndex
=========================================================== */
.topicsArea{display:flex;flex-wrap:nowrap;flex-direction:row;align-items:flex-start;justify-content:space-between;}
.topicsArea .left{width:260px;}
.topicsArea .right{width:calc(100% - 300px);}










/* ===========================================================
 content
=========================================================== */
.breadcrumb{margin:0 auto;padding:12px 0;background-color:#f9f9f9;font-size:85.7%;}
.breadcrumb a{color:#333;text-decoration:none;}
.breadcrumb a:hover{color:#333;text-decoration:underline;}
.CategoryTitlePane{margin:0 auto;}
#skin > .main{padding: 0 0 50px;}
#skin.skin1Column > .main > .inner,
#skin.skin2Columns > .main > .inner{padding:20px 0 0;}

/* ===========================================================
 footBody
=========================================================== */
.footer{margin:0;padding:0;}

.footTop{border-top:3px solid #da0019;background-color:#fff;}
.pagetop{padding:25px;}
.pagetop a{display:block;overflow:hidden;width:56px;height:36px;margin:0 0 0 auto;background:url(/Portals/0/responsive/images/common/pagetop.png) center top 4px no-repeat transparent;color:transparent;white-space:nowrap;text-indent:200%;transition-duration:0.3s;transition-property:all;}
.pagetop a:hover{background:url(/Portals/0/responsive/images/common/pagetop.png) center top no-repeat transparent;}

.footBottom{min-height:400px;background-color:#000;}
.copyright{margin:0 auto;padding:10px 0;color:#fff;font-size:92.9%;text-align:center;}

/* ===========================================================
 css for each skin
=========================================================== */
.skinIndex .mainArea > .inner + *{border-top:1px solid #ddd;}
.skin2Columns .main .inner{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;}
.skin2Columns .mainArea{width: calc(100% - 310px);order:1;}
.skin2Columns .sideArea{width: 260px;order:0;}

/* ===========================================================
 css for admin
=========================================================== */
/* css-for-adminModules */
.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:last-child{line-height:1;}
.ModuleTitle_MenuItem{font-size:12px !important;}

/* スマホプレビュー */
.selectBox + .fancybox-wrap,
.selectBox + .fancybox-wrap *{box-sizing:content-box !important;}
.previewMode .fancybox-opened{z-index:99999999 !important;}

/* header固定解除 */
.adminMode header{position:relative;}
.adminMode #skin{padding:0;}

/* コンパネ */
.controlPanel{height:auto!important;margin-top:80px;}

/* メガメニュー編集用スキン */
.skinMega .headBottom{display:block!important;}