/*  Typo
----------------------------------------------- */

a:link, a:visited
{
    text-decoration: underline;
    color:#ABA8E5;
}
a:active { text-decoration: underline; }
a:hover { text-decoration:none; }


h1 { font:bold 18px/140% "Trebuchet MS", Verdana, sans-serif; color:#FFFFFF;}
h2 { font:bold 14px/140% "Trebuchet MS", Verdana, sans-serif; color:#FFFFFF;}

p { font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif; color:#FFFFFF;}

/*  Layout
----------------------------------------------- */

body {
    background: #333333 !important;
    padding:35px 0 0 0;
    margin:0;
    font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;
    color:#FFFFFF;
    animation: loading 1s;
}
@keyframes loading {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

#container
{
    box-sizing:border-box;
    margin:0 auto;
    width:100%;
    max-width:960px;
    background:#000000;
    color:#FFFFFF;
}

#content
{
    box-sizing:border-box;
    width:100%;
    color:#FFFFFF;
}

#footer
{
    clear:both;
    margin-top:10px;
    background:url(https://u.jimcdn.com/cms/o/s43a56ac716b5f85a/userlayout/img/footer-bg.gif?t=1458542920) repeat-x top;
    height:65px;
}

#footer .gutter 
{
    height:30px;
    padding:35px 15px 0 90px;
}
#footer .gutter #contentfooter .leftrow { width:auto !important;}

/*  NEW Add CSS
----------------------------------------------- */
/*----- ヘッダー -----*/
header { position:fixed; top:0; right:0; left:0; z-index:2; padding:0; text-align:center; background-color:#333333;}
header #header { position:relative; width:auto; max-width:940px; margin:0 auto; padding:0 10px; text-align:center; background-color:#000000;}
header #header #mainlogo { position:relative; display:inline-block; width:320px; margin:0 auto; transition:0.5s ease;}
header #header.fixed #mainlogo { width:180px; transition:0.5s ease;}
header #header #mainlogo img { width:100%;}
header #header #mainlogo img:hover { opacity:0.7;}
header #header #btn-mail { display:none;}
header #header h1 { height:10px; overflow-y:hidden; text-align:center; color:#000000; font-size:5px;}
@media all and (max-width:719px)
{
header { background-color:#000000;}
header #header { text-align:center; margin:0 auto 0;}
header #header #mainlogo { width:240px; padding:0 0 10px;}
header #header #corpinfo { display:none;}
header #header #btn-mail { display:block; position:absolute; top:0; right:-15px; width:30px; text-align:right; z-index:1;}
header #header #btn-mail img { width:100%; height:auto;}
}

/*----- メニューのスタイル -----*/
ul.cc-nav-level-0 { position:relative; width:100%; max-width:1100px; margin:0 auto; padding-bottom:0; list-style:none; font-size:0; z-index:9999; pointer-events:auto; padding-inline-start:0;}
ul.cc-nav-level-0 > li { position:relative; box-sizing:border-box; display:inline-block; vertical-align:top; width:auto; margin:0; padding:0; border-bottom:none; border-left:#666666 1px dotted;}
ul.cc-nav-level-0 > li:last-of-type { border-right:#666666 1px dotted;}
ul.cc-nav-level-0 > li a { display:block; padding:10px 1.7em; border:none; text-align:center; font-size:14px; color:#FFFFFF !important; text-decoration:none; transition:all 0.5s ease 0s;}
ul.cc-nav-level-0 > li a:hover { text-decoration:none; color:#ABA8E5 !important; background:#000000;}
ul.cc-nav-level-1 { box-sizing:border-box; display:none; position:absolute; width:240px; margin:0 auto; padding-bottom:0; list-style:none; font-size:0; padding-inline-start:0;}
ul.cc-nav-level-1 > li { position:relative;}
ul.cc-nav-level-1 > li a { padding-left:2.0em; text-indent:-1.3em; text-align:left; font-size:14px; color:#FFFFFF !important;}
ul.cc-nav-level-2 { box-sizing:border-box; display:none; position:absolute; top:0; left:100%; width:200px; margin:0 auto; padding-bottom:0; list-style:none; font-size:0; padding-inline-start:0;}
ul.cc-nav-level-2 > li a { padding-left:2.0em; text-indent:-1.3em; text-align:left; font-size:14px; color:#FFFFFF !important;}
ul.cc-nav-level-1 > li a:before { display:inline; content:"\0020\025b6\0020"}
ul.cc-nav-level-0 > li:hover ul.cc-nav-level-1 { display:block; background:#000000;}
ul.cc-nav-level-0 > li:hover ul.cc-nav-level-1 li { display:block;}
ul.cc-nav-level-1 > li:hover ul.cc-nav-level-2 { display:block; background:#000000;}
ul.cc-nav-level-1 > li:hover ul.cc-nav-level-2 li { display:block;}

#mainmenu input { display:none !important;}
#mainmenu label { display:none !important;}
@media all and (max-width:719px)
{
#mainmenu label { cursor:pointer; display:block !important; position:absolute; top:10px; left:10px; width:30px; height:30px; font-size:0; background:url(https://u.jimcdn.com/cms/o/s43a56ac716b5f85a/userlayout/img/menubtn-open.gif?t=1780830182) center center no-repeat; background-size:cover;}
#mainmenu ul.cc-nav-level-0 { position:absolute; left:0; background-color:rgba(0,0,0,0.9); transition:all .5s;}
#mainmenu ul.cc-nav-level-0 > li { display:block; border:none; height:0; overflow-y:hidden; transition:all .5s;}
#menu_open:checked ~ label { background:url(https://u.jimcdn.com/cms/o/s43a56ac716b5f85a/userlayout/img/menubtn-close.gif?t=1780830187) center center no-repeat; background-size:cover;}
#menu_open:checked ~ div ul.cc-nav-level-0 { height:62vh; overflow-y:scroll; overscroll-behavior-y:none; border-bottom:#FFFFFF 5px solid !important; z-inedx:10;}
#menu_open:checked ~ div ul.cc-nav-level-0 > li { height:auto; overflow-y:visible; border-top:#FFFFFF 1px solid !important; transition:all .5s;}
#menu_open:checked ~ div ul.cc-nav-level-0 > li:last-of-type { border-bottom:#FFFFFF 1px solid !important;}
ul.cc-nav-level-0 > li a { text-align:left;}
ul.cc-nav-level-0 > li a:before { display:inline; content:"\0020\025b6\0020"}
ul.cc-nav-level-1 { position:relative; display:block; width:auto; padding-inline-start:20px;}
ul.cc-nav-level-1 > li { border-top:#FFFFFF 1px dotted;}
ul.cc-nav-level-1 > li a { padding-left:40px;}
ul.cc-nav-level-2 { position:relative; left:0; display:block; width:auto;}
ul.cc-nav-level-2 > li a { padding-left:60px;}
}

/*----- メイン -----*/
main { padding:200px 20px 0; text-align:center; color:#FFFFFF !important;}
h1 { margin:40px 0; text-align:center; font-size:3.2rem;}
h1.contents-title { margin:160px 0 40px; padding:0 0 10px; border-bottom:#00499C 2px solid; color:#FFFFFF !important; font-size:3.2rem; font-weight:normal;}
@media all and (max-width:719px)
{
main { padding:140px 0 10px; text-align:center;}
h1.contents-title { margin:80px 0 40px; font-size:2.4rem;}
}

/*----- フッター -----*/
#footer { height:auto; color:#FFFFFF; background:#000000;}
#footer .gutter { padding:10px 15px; text-align:center;}
#footer .gutter a { color:#ABA8E5;}
#footer div#contentfooter div.lefttrow { float:none; width:auto; text-align:center;}