@charset "utf-8";
@import "/Portals/0/Skins/skin_common.css";

/*========================================================
 common 3aa3a1 #4388c4
 ========================================================*/
/* link */
a,
a:link,
a:visited,
a:hover{outline:0;color:#3aa3a1;text-decoration:none;transition:opacity 0.3s;}
a:hover{text-decoration:underline;}
a:hover img{opacity:0.75;}
html,
body{font-size:15px;}

/* ===========================================================
 header
=========================================================== */
#skin:not(.skinIndex) #header{border-bottom:1px solid #ddd;}
#header > .inner{display:flex;position:relative;flex-direction:row;padding-bottom:54px;justify-content:space-between;align-items:center;flex-wrap:nowrap;}

/* leftArea + rightArea
------------------------------ */
header .leftArea{}
header .rightArea{display:flex;flex-direction:row;align-items:center;flex-wrap:nowrap;justify-content:flex-start;}
header .rightArea > *{display:inline-block;vertical-align:middle;}

/* logo
------------------------------ */
header .logoArea{margin:0;padding:28px 0 28px;}
header .logoArea a{display:block;}
header .logoArea a img{display:block;}


/* ===========================================================
 gNav
=========================================================== */
#gNav{display:block;position:absolute;right:0;bottom:0;left:0;}
#gNav:before{content:"";display:block;position:absolute;top:-1px;left:-100%;width:200vw;height:1px;background-color:#e5e5e5;}
.tokenMenu ul{list-style:none;margin:0;padding:0;}
.tokenMenu ul li{padding:0;}
.tokenMenu ul:after,
.tokenMenu ul li:after{content:"";display:block;clear:both;}
.tokenMenu ul li a{display:block;color:#333;font-size:15px;text-align:center;transition:color 0.3s,opacity 0.3s;}
.tokenMenu ul li a:hover{color:#4388c4;text-decoration:none;}
.tokenMenu ul li a[href="#"]:hover{opacity:1;color:#333;cursor:default;}

/* 1st Phase home
------------------------------ */
.tokenMenu > ul{}
.tokenMenu > ul > li{position:relative;}
.tokenMenu > ul > li:last-child{}
.tokenMenu > ul > li > a{position:relative;float:left;width:25%;padding:15px 1em;border-right:#e5e5e5 solid 1px;border-left:#e5e5e5 solid 1px;font-weight:bold;transition:all 0s;}
.tokenMenu > ul > li > a:hover{opacity:1;}
.tokenMenu > ul > li > a:before{}
.tokenMenu > ul > li > a:after{content:"";display:block;position:absolute;right:0;bottom:0;left:0;width:100%;height:5px;margin:auto;}

/* 2nd Phase
------------------------------ */
.tokenMenu > ul > li > ul{float:right;width:75%;}
.tokenMenu > ul > li > ul > li{display:none;border-right:#e5e5e5 solid 1px;}
.tokenMenu > ul > li > ul > li.Tab101,
.tokenMenu > ul > li > ul > li.Tab109,
.tokenMenu > ul > li > ul > li.Tab137{display:block;float:left;width:33.33333%;}
.tokenMenu > ul > li > ul > li > a{position:relative;padding:15px 0.5em;background:#fff;font-weight:bold;transition:all 0s;}

/* hover + current
------------------------------ */
/*.tokenMenu > ul > li > a:hover,
.tokenMenu > ul > li > a[href="#"]:hover,
.tokenMenu > ul > li > ul > li:hover > a,
.tokenMenu > ul > li > ul > li:hover > a:hover,
.tokenMenu > ul > li > ul > li:hover > a[href="#"]:hover{background:rgb(67,148,208);background:-webkit-linear-gradient(left, rgba(67,148,208,1) 0%,rgba(49,178,112,1) 100%);background:linear-gradient(to right, rgba(67,148,208,1) 0%,rgba(49,178,112,1) 100%);color:#fff;}*/

.tokenMenu > ul > li > a:hover,
.tokenMenu > ul > li > a[href="#"]:hover,
.tokenMenu > ul > li > ul > li:hover > a,
.tokenMenu > ul > li > ul > li:hover > a:hover,
.tokenMenu > ul > li > ul > li:hover > a[href="#"]:hover{color:#4388c4;}


/*.skinIndex .tokenMenu > ul > li > ul > li > a:before{content:"";display:block;opacity:0;position:absolute;top:calc(100% + -1px);right:0;left:0;z-index:60;width:0;height:0;margin:auto;border-width:0 7.5px 17px 7.5px;border-color:transparent transparent rgba(255,255,255,0.92) transparent;border-style:solid;}*/

.tokenMenu > ul > li > ul > li > a:before{content:"";display:block;opacity:0;position:absolute;top:calc(100% + -1px);right:0;left:0;z-index:60;width:0;height:0;margin:auto;border-width:0 7.5px 17px 7.5px;border-color:transparent transparent rgba(255,255,255,0.92) transparent;border-style:solid;}
.tokenMenu > ul > li a.CurrentLinkClass,
.tokenMenu > ul > li > ul > li a.ParentLinkClass{color:#4388c4;}
.tokenMenu > ul > li.CurrentItem > a:after,
.tokenMenu > ul > li > ul > li.CurrentItem > a:after,
.tokenMenu > ul > li > ul > li.ParentItem > a:after{content:"";display:block;position:absolute;right:0;bottom:0;left:0;width:100%;height:5px;margin:auto;background:rgb(67,148,208);transition:opacity 0.3s;}

/* megaMenu
------------------------------ */
/*.skinIndex .tokenMenu > ul > li > ul > li > ul{top:calc(100% + 15px);}*/
.tokenMenu > ul > li > ul > li > ul{display:none;position:absolute;top:100%;left:0;z-index:50;width:100%;padding:40px 50px;border:1px solid #ddd;box-shadow:0 30px 30px -14px rgba(0,0,0,0.3);background-color:rgba(255,255,255,1);}
.tokenMenu > ul > li > ul > li:hover > ul{display:block;}
.tokenMenu > ul > li > ul > li > ul:before{content:"";display:block;position:absolute;right:0;bottom:100%;left:0;z-index:60;width:100%;height:15px;margin:auto;}
/* mega title */
.tokenMenu > ul > li > ul > li > ul > li{float:left;width:47.5%;margin:0 5% 0 0;}
.tokenMenu > ul > li > ul > li > ul > li:nth-child(2n){float:right;margin-right:0;}
.tokenMenu > ul > li > ul > li > ul > li > a{display:block;margin:0 0 15px;padding:15px 0;border-bottom:1px solid #ccc;font-weight:bold;font-size:17px;line-height:1.2;text-align:left;}
/* mega child */
.tokenMenu > ul > li > ul > li > ul > li > ul > li > a{position:relative;padding:0 0 5px 15px;font-size:16px;line-height:1.4;text-align:left;}
.tokenMenu > ul > li > ul > li > ul > li > ul > li > a:before{content:"";display:block;position:absolute;top:0.55em;left:0;width:5px;height:3px;margin:auto;background-color:#ffb400;}
.tokenMenu > ul > li > ul > li > ul > li > ul > li > ul{display:none;}


/* ===========================================================
 content
=========================================================== */
.skinIndex #main > *:nth-child(even){background-color:#f4f4f4;}
.skinIndex #main .inner{padding-top:60px;padding-bottom:60px;}
.skinIndex #main > .contentFmmcIndex > div > .inner,
.skinIndex #main > .contentFmmcIndex > .contentFmmcMiddleWrap > div > .inner{padding:0;}
.skinIndex #main > .contentFmmcIndex .bgGray{position:relative;background-color:#f4f4f4;}
.skinIndex #main > .contentFmmcIndex .contentFmmcMiddle01{background:url(/Portals/0/images/index/bg_01.jpg) center center no-repeat;background-size:cover;}
.skinIndex .contentFmmcMiddle01{overflow:hidden;}
.skinIndex #main > .contentFmmcIndex .bgGray:before,
.skinIndex #main > .contentFmmcIndex .bgGray:after{content:"";display:block;position:absolute;left:0;width:100%;height:1px;background-color:#e5e5e5;}
.skinIndex #main > .contentFmmcIndex .bgGray:before{top:-1px;}
.skinIndex #main > .contentFmmcIndex .bgGray:after{bottom:-1px;}
.skinIndex #main > .contentFmmcIndex .contentFmmcMiddleWrap > *{clear:both;}
/* ===========================================================
 footer
=========================================================== */
/*#footer{margin:180px 0 0;padding:0;background:-webkit-linear-gradient(left, rgba(67,148,208,1) 0%,rgba(49,178,112,1) 100%);background:linear-gradient(to right, rgba(67,148,208,1) 0%,rgba(49,178,112,1) 100%);color:#fff;}
*/
/*.pagetop{margin:0;background:-webkit-linear-gradient(left, rgba(67,148,208,1) 0%,rgba(49,178,112,1) 100%);background:linear-gradient(to right, rgba(67,148,208,1) 0%,rgba(49,178,112,1) 100%);}*/
#footer{margin:180px 0 0;padding:0;background:#3f8ac9;color:#fff;}
.skinIndex #footer{margin-top:0;}
#footer a{color:#fff;}
.pagetop{margin:0;background:#3f8ac9;}


/* ===========================================================
 「管理者のみに公開」と赤枠削除
=========================================================== */
.previewMode div[style="border-top:2px #FF0000 solid;border-bottom:2px #FF0000 solid;border-right:2px #FF0000 solid;border-left:2px #FF0000 solid;"]{border:none !important;}
.previewMode div[style="border-top:2px #FF0000 solid;border-bottom:2px #FF0000 solid;border-right:2px #FF0000 solid;border-left:2px #FF0000 solid;"] > span > center{display:none;}



