.pc_ver { display:block; }
.mo_ver { display:none; }
@media(max-width:1000px){
.pc_ver { display:none; }
.mo_ver { display:block; }
}



/* header */
#header{width:100%;height:100px;position:absolute;top:0;left:0;z-index: 99999999;}
#header.fixed{position:fixed}
#header .header-wrap{width:100%;min-width:1400px;margin:0px auto;position:relative;background:#fff;/*-webkit-box-shadow:5px 5px 20px rgba(0,0,0,.05);box-shadow:5px 5px 20px rgba(0,0,0,.05);*/-webkit-transition:.2s width ease;transition:.2s width ease}
#header h1.logo{position:absolute;top:6px;left:2%;-webkit-animation:logo 1s ease;animation:logo 1s ease}
@-webkit-keyframes logo{0%{-webkit-transform:translate(70px,0);transform:translate(70px,0);opacity:0}
100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}
}
@keyframes logo{0%{-webkit-transform:translate(70px,0);transform:translate(70px,0);opacity:0}
100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}
}
#header nav{font-size:0;margin:0 auto;text-align:center;-webkit-animation:navi 1.2s ease;animation:navi 1.2s ease}
@-webkit-keyframes navi{0%{opacity:0}
100%{opacity:1}
}
@keyframes navi{0%{opacity:0}
100%{opacity:1}
}
#header nav div.nav{display:none;background:rgba(0,0,0,.8);position:absolute;top:100%;left:0;width:100%;height:200px}
#header nav>ul{display:inline-block;text-align:left;margin-right: 90px;}
#header nav>ul>li{display:inline-block;vertical-align:top;color:#fff;letter-spacing:-1px;padding: 0 40px;text-align:center;position:relative;}
#header nav>ul>li>a{font-size:18px;line-height:88px;display:block}
#header nav>ul>li>ul{display:none;position:absolute;top:100%;left:0;width:100%;height:230px;padding-top:36px}
#header nav>ul>li>ul>li>a{font-size:16px;color:#fff;line-height:2;font-weight:400}
#header nav>ul>li>ul>li>a:hover{color:#eee}
#header div.util{position:absolute;top:28px;right:2.5%;-webkit-animation:util 1s ease;animation:util 1s ease;}
@-webkit-keyframes util{0%{-webkit-transform:translate(-70px,0);transform:translate(-70px,0);opacity:0}
100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}
}
@keyframes util{0%{-webkit-transform: translate(-30px,0);transform: translate(-30px,0);opacity:0;}
100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}
}
#header div.util>ul>li{display:inline-block;vertical-align:top;padding:0 4px;line-height:2}
#header div.util>ul>li>a{color:#444;font-size:15px;font-weight:500;letter-spacing:-.5px;
border-radius:20px; border:1px solid #ddd; padding:4px 15px 5px 15px; }
#header div.util>ul>li>a:hover { background:#555; color:#fff; border:1px solid #555; }
#header div.util>ul>li.myoffice a {color:#f15a24; border:1px solid #f15a24;}
#header div.util>ul>li.myoffice a:hover { background:#f15a24; color:#fff; border:1px solid #f15a24; }
#header div.util>ul>li.myoffice img{display:inline-block;margin-left:5px;vertical-align:top}
#header.fixed .header-wrap{width:100%;margin:0 auto;-webkit-box-shadow:none;box-shadow:none;border-bottom:1px solid #e5e5e5}
/*
#header.fixed h1.logo{left:2%}
#header.fixed div.util{right:3%}
*/
/*@media screen and (max-width: 1700px) {#header nav > ul > li {padding: 0px 25px;}}*/
/*@media screen and (max-width: 1570px) {#header nav > ul > li {padding: 0px 20px;}}*/


#footer { background:#f5f5f5; padding:70px 50px; /* border-top:1px solid #ddd; */ }
#footer .footer-wrap { position:relative; width:100%; margin:0 auto; padding-left:220px; }
#footer .footer-wrap .bottom_logo { position:absolute; left:0; top:0; width:170px; }
#footer .footer-wrap .bottom_logo img { max-width:100%; }
#footer .footer-wrap ul { display:flex; flex-wrap:wrap; line-height:170%; }
#footer .footer-wrap li { font-size:14px; margin-left:20px; color:#777; position:relative;  }
#footer .footer-wrap ul li:first-child { margin:0; }
#footer .footer-wrap ul.bottom_menu { border-bottom:1px solid #ddd; padding-bottom:15px; margin-bottom:15px; }
#footer .footer-wrap ul.bottom_menu li { font-size:18px; margin-left:30px; }
#footer .footer-wrap ul.bottom_menu li:first-child { margin:0; }
#footer .footer-wrap ul.copyright { padding-top:10px; font-size:14px; }
#footer .btn_top a { position:absolute; right:0; top:0px; background:#222; color:#fff; display:flex; justify-content:center; align-items:center; width:70px; height:70px; border-radius:35px }

.contents01 { padding-top:80px; width:95%; max-width:1500px; margin:0 auto; }


.opacity_black2 { width:100%; min-height:100%; display:none; background:rgba(0,0,0,0.5); }

.btn_close_wing { display:none; }
.btn_close_wing_homepage { display:none; }
.folding_menu_btn { display:none; }
.folding_menu_btn_homepage { display:none; }


.wing_menu { color:#333; padding:0px 0 100px 0; width:300px; min-height:100%; position:relative; background:#fff; 
min-width:300px;overflow-y:scroll !important; height:100vh;  }

.wm_title { background:#193b56; padding:15px; color:#fff; }
.wm_title h1 { font-size:22px; font-weight:400; display:flex; align-items:center; }
.wm_btn_logout { font-size:11px; color:#fff; background:rgba(0,0,0,.6); border-radius:5px; margin:3px 0 0 10px; 
height:16px; line-height:14px; padding:0px 4px; font-weight:100; display:inline-block; }



.accordion {  width: 100%;   margin: 0px auto 20px; }

.accordion .link { cursor: pointer;  display: block;  padding: 15px 15px 15px 25px; 
font-size: 14px;  border-bottom: 1px solid #ddd;  position: relative;  
-webkit-transition: all 0.4s ease;  -o-transition: all 0.4s ease;  transition: all 0.4s ease; }

.accordion li:last-child .link { border-bottom: 0; }
.accordion li i {  position: absolute;  top: 16px;  left: 12px;  font-size: 18px;  
color: #aaa;  -webkit-transition: all 0.4s ease;  -o-transition: all 0.4s ease;  transition: all 0.4s ease;}
.accordion li i.fa-chevron-down {  right: 20px;  left: auto;  font-size: 16px;}
.accordion li.open .link { color: #333; }
.accordion li.open i { color: #aaa; }
.accordion li.open i.fa-chevron-down {  -webkit-transform: rotate(180deg);  -ms-transform: rotate(180deg);
-o-transform: rotate(180deg);  transform: rotate(180deg);}

.submenu {  display: none;  background: #f5f5f5;  font-size: 14px;}
.submenu li { border-bottom: 1px solid #eee; }
.submenu a {  display: block;  text-decoration: none;  color: #555;  padding: 12px;  padding-left: 42px;  -webkit-transition: all 0.25s ease;  -o-transition: all 0.25s ease;  transition: all 0.25s ease;}
.submenu a:hover {  background: #fff;  color: #333;}





.my_office_layout_left {  min-width:100%; }
.header-wrap-mo { display:none; }


.homepage_layout_left { display:none; min-width:100%; min-height:100%; }


.btn_close_wing_2_homepage {flex-grow:1; min-height:100%;}

@media(max-width:1000px){
#header,
#header.fixed{position:relative; height:60px; }
.opacity_black2 { display:flex; }
.contents01 { padding-top:0px; width:100%; margin:0 auto; }
.btn_close_wing { display:block; position:absolute; top:20px; right:20px; }
.btn_close_wing span { color:#fff; font-size:30px; font-weight:500; display:block; cursor:pointer; }
.btn_close_wing_homepage { display:block; position:absolute; top:20px; right:20px; }
.btn_close_wing_homepage span { color:#fff; font-size:30px; font-weight:500; display:block; cursor:pointer; }
.folding_menu_btn { z-index:2; display:flex; align-items:center; position:absolute; top:10px; left:5px;
width:45px; height:45px; /*background:rgba(0,0,0,.6); */ background:#fff; }
.folding_menu_btn ul { width:25px; margin:0 auto; }
.folding_menu_btn ul li { height:2px; width:25px; background:#aaa; margin-top:6px; }
.folding_menu_btn ul li:first-child { margin:0; }
.my_office_layout_left { /* flex-shrink:0; */ width:300px; height:100%; 
position:absolute; top:0; left:0px; z-index:9999999999999999999; }
.homepage_layout_left { /* flex-shrink:0; */ width:300px; height:100%; 
position:absolute; top:0; left:0px; z-index:9999999999999999999;min-height:100%; }

.body_overflowhidden { overflow-y:hidden; }

.folding_menu_btn_homepage { z-index:2; display:flex; align-items:center; position:absolute; top:10px; left:5px;
width:45px; height:45px; /*background:rgba(0,0,0,.6); */ background:#fff; }
.folding_menu_btn_homepage ul { width:25px; margin:0 auto; }
.folding_menu_btn_homepage ul li { height:2px; width:25px; background:#aaa; margin-top:6px; }
.folding_menu_btn_homepage ul li:first-child { margin:0; }


.header-wrap { display:none; }
.header-wrap-mo { display:block; background:#fff; padding-left:50px; height:65px; position:relative; }
.header-wrap-mo h1.logo_m img { max-height:40px;  margin-top:10px; }
.header-wrap-mo .myoffice a { position:absolute; top:18px; right:10px; font-size:12px; line-height:14px; padding:8px 7px; background:#999; 
color:#fff; border-radius:7px; }
.header-wrap-mo .cart a { position:absolute; top:19px; right:95px; width:25px; height:25px; }
.header-wrap-mo .cart { }

.m_side_btn { padding:0 10px; display:flex; }
.m_side_btn a { display:block; border:1px solid #ddd; padding:10px 0; text-align:center;
flex-grow:1; margin:0 3px; border-radius:5px; flex-basis:1; }

#footer { background:#f5f5f5; padding:20px 10px 30px 10px;  }
#footer .footer-wrap { position:relative; width:100%; margin:0 auto; padding:0; }
#footer .footer-wrap .bottom_logo { position:relative; width:150px; }
#footer .footer-wrap .bottom_logo img { max-width:100%; }
#footer .footer-wrap ul { display:flex; flex-wrap:wrap; line-height:120%; padding:0 8px; }
#footer .footer-wrap li { font-size:10px; margin:0 10px 0 0 !important; color:#777; position:relative;  }
#footer .footer-wrap ul.bottom_menu { border-bottom:1px solid #ddd; padding-bottom:15px; margin-bottom:15px; }
#footer .footer-wrap ul.bottom_menu li { font-size:13px; margin-left:10px; white-space:nowrap; }
#footer .footer-wrap ul.bottom_menu li:first-child { margin:0; }
#footer .footer-wrap ul.copyright { padding-top:10px; font-size:14px; }
#footer .btn_top a { position:absolute; right:0; top:0px; background:#222; color:#fff; display:flex; justify-content:center; align-items:center;
width:50px; height:50px; border-radius:25px }



}



.page_toparea { background:url('../image/bottom_img.jpg') no-repeat; background-size:cover; width:100%; height:300px;  
background-position: center;  text-align:center; display:flex; justify-content:center; align-items:center; 
}
.page_toparea h1 { color:#fff; font-size:40px; }

.page_toparea_pc { margin-top:80px; }

.page_menu { background:#f5f5f5; }
.page_menu ul { display:flex; justify-content:center; }
.page_menu li { margin:0 20px; }
.page_menu a { display:block; padding:20px; font-size:18px; }
.page_menu a.selected { color:#2470b1; border-bottom:2px solid #2470b1; font-weight:bold; }



@media(max-width:800px){

.page_toparea {  height:100px; margin-top:0px; }
.page_toparea h1 { color:#fff; font-size:25px; }

.page_menu { background:#f5f5f5; }
.page_menu ul { display:flex; justify-content:space-between; padding:0 10px; }
.page_menu li { margin:0 5px; text-align:center; flex-grow:1; }
.page_menu a { display:block; padding:10px 0; font-size:14px; }
.page_menu a.selected { color:#2470b1; border-bottom:2px solid #2470b1; font-weight:bold; }
}