@charset "UTF-8";
/* CSS Document */

/* --------------------------------------------------
	Reset
-------------------------------------------------- */

#customer_header div,
#customer_header dl,
#customer_header dt,
#customer_header dd,
#customer_header ul,
#customer_header ol,
#customer_header li,
#customer_header h1,
#customer_header h2,
#customer_header h3,
#customer_header h4,
#customer_header h5,
#customer_header h6,
#customer_header pre,
#customer_header form,
#customer_header fieldset,
#customer_header input,
#customer_header textarea,
#customer_header p,
#customer_header blockquote,
#customer_header th,
#customer_header td,
#customer_header img,
#customer_footer div,
#customer_footer dl,
#customer_footer dt,
#customer_footer dd,
#customer_footer ul,
#customer_footer ol,
#customer_footer li,
#customer_footer h1,
#customer_footer h2,
#customer_footer h3,
#customer_footer h4,
#customer_footer h5,
#customer_footer h6,
#customer_footer pre,
#customer_footer form,
#customer_footer fieldset,
#customer_footer input,
#customer_footer textarea,
#customer_footer p,
#customer_footer blockquote,
#customer_footer th,
#customer_footer td,
#customer_footer img { margin:0; padding:0; }

#customer_header table,
#customer_footer table {border-collapse:collapse; border-spacing:0; }

#customer_header fieldset,
#customer_header img,
#customer_footer fieldset,
#customer_footer img  { border:0; }

#customer_header address,
#customer_header caption,
#customer_header cite,
#customer_header code,
#customer_header dfn,
#customer_header em,
#customer_header strong,
#customer_header th,
#customer_header var,
#customer_footer address,
#customer_footer caption,
#customer_footer cite,
#customer_footer code,
#customer_footer dfn,
#customer_footer em,
#customer_footer strong,
#customer_footer th,
#customer_footer var { font-style:normal; font-weight:normal; }

#customer_header ol,
#customer_header ul,
#customer_footer ol,
#customer_footer ul { list-style:none; }

#customer_header caption,
#customer_header th,
#customer_footer caption,
#customer_footer th { text-align:left; }

#customer_header h1,
#customer_header h2,
#customer_header h3,
#customer_header h4,
#customer_header h5,
#customer_header h6,
#customer_footer h1,
#customer_footer h2,
#customer_footer h3,
#customer_footer h4,
#customer_footer h5,
#customer_footer h6 { font-size:100%; font-weight:normal; }

#customer_header img,
#customer_footer img { vertical-align:top; }

#customer_header hr,
#customer_footer hr { display:none; }

#customer_header a,
#customer_footer a { border:none; outline:none; }


/* --------------------------------------------------
	Layout
-------------------------------------------------- */
#webc_con{ padding: 60px 0 0 !important;}
#webc_con .webc_pagetop{ bottom: 65px;}

@media screen and (min-width: 601px) {
#webc_con{ padding: 150px 0 50px !important;}
#webc_con .webc_pagetop{ bottom: 15px;}
}

#customer_header ,
#customer_footer { min-width: 0; background: #fff; color: #000; font-size: 16px; font-weight: normal; line-height: 1.5; font-family: "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif; -webkit-text-size-adjust: 100%; position: relative; font-feature-settings: "palt"; letter-spacing: 0.08em;  -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;}

/* ===================================================
Base Common Style （モバイルファースト）
====================================================== */
#customer_header a,
#customer_footer a { color: #000; text-decoration: none;}
#customer_header a:hover,
#customer_footer a:hover{ color: #000; text-decoration: underline;}
#customer_header a:hover img,
#customer_footer a:hover img { opacity: 0.75;}

#customer_header .view_pc,
.view_pc { display: none;}
#customer_header .view_sp,
.view_sp { display: inline-block;}

#customer_header .br_pc,
.br_pc{ display: none;}
#customer_header .br_sp,
.br_sp{ display: block;}

@media screen and (min-width: 601px) {
#customer_header ,
#customer_footer { min-width: 1200px; font-size: 15px; line-height: 1.5; letter-spacing: 0.08em;}

#customer_header .view_pc,
#customer_footer .view_pc { display: inline-block;}
#customer_header .view_sp,
#customer_footer .view_sp { display: none;}

#customer_header .br_pc,
#customer_footer .br_pc{ display: block;}
#customer_header .br_sp,
#customer_footer .br_sp{ display: none;}
}


/* ---------------------------------------------------
Common Parts
------------------------------------------------------ */
/* Hover In to Out (下線が中央から外へ a > span) */
.hover_inout { position: relative; display: inline-block; transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); backface-visibility: hidden; }
.hover_inout:before { content: ""; position: absolute; z-index: -1; left: 50%; right: 50%; bottom: -15px; background: #555; height: 1px; transition-property: left, right; transition-duration: 0.4s; transition-timing-function: cubic-bezier(0.12, 0.915, 0.43, 1);}
a:hover .hover_inout:before,
a:focus .hover_inout:before,
a:active .hover_inout:before { left: 0; right: 0;}
.current a .hover_inout:before { left: 0; right: 0;}

/* Hover Left to Right (下線が左から右へ a) */
.hover_lr { display: inline-block; position: relative; text-decoration: none; }
.hover_lr:hover{ text-decoration: none; }
.hover_lr::after { background-color: #333; bottom: 0; content: ""; height: 1px; left: 0; position: absolute; transform: scale(0, 1); transform-origin: right top; transition: transform .3s; width: 100%; }
.hover_lr:hover::after { transform-origin: left top; transform: scale(1, 1); }


/* ---------------------------------------------------
Global Header
------------------------------------------------------ */
#customer_header #g_header { height: 55px; position: absolute; z-index: 30;}
#customer_header #g_header .hd_logo{ padding: 10px 0 0 10px; width: 200px; height: auto;}
#customer_header #g_header .hd_logo img{ width: 100%; height: auto;}

@media screen and (min-width: 601px) {
#customer_header #g_header { display: flex; justify-content: flex-start; align-items: center; height: 100px; width: 100%;}
#customer_header #g_header .hd_logo{ padding: 0 0 0 1.5%; width: 20%; max-width: 306px;}
#customer_header #g_header .hd_nav{ display: flex; justify-content: space-between; align-items: center; margin: 0 390px 0 auto; /* text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8); */}
#customer_header #g_header .hd_nav li{ font-size: 18px; line-height: 1; flex-shrink: 0; margin: 0 5px;}
#customer_header #g_header .hd_nav li a{ display: flex; align-items: center; height: 80px; padding: 0 8px; position: relative; /* color: #fff; */}
#customer_header #g_header .hd_nav li a:hover{ text-decoration: none;}
#customer_header #g_header .hd_btns{ position: fixed; top: 0; right: 100px; display: flex;}
#customer_header #g_header .hd_btns li.hd_btn_01{ width: 150px;}
#customer_header #g_header .hd_btns li.hd_btn_02{ width: 130px; border-left: solid 1px #888;}
#customer_header #g_header .hd_btns li a{ color: #fff; text-decoration: none; display: block; height: 100px; width: 100%; background-color: #295587; background-repeat: no-repeat; font-size: 18px; line-height: 100px; text-align: center; box-sizing: border-box; transition: background-color 0.5s;}
#customer_header #g_header .hd_btns li a:hover{ background-color: #3875ba;}
#customer_header #g_header .hd_btns li.hd_btn_01 a{ background-image: url(https://storage.489ban.net/storage/customer/1075/489ban/ico_cal_01_w.svg); background-position: calc(50% - 2.3em) 50%; background-size: 24px; padding: 0 0 0 1.5em;}
#customer_header #g_header .hd_btns li.hd_btn_02 a{ background-image: url(https://storage.489ban.net/storage/customer/1075/489ban/ico_bag_01_w.svg); background-position: calc(50% - 1.8em) 50%; background-size: 24px; padding: 0 0 0 1.5em;}
}

/* ---------------------------------------------------
Global Navigation
------------------------------------------------------ */
#customer_header #gnav { position: fixed; top: 0; right: 0; bottom: 0; overflow: auto; width: 100%; background-color: #fff; box-sizing: border-box; opacity: 0; z-index: 40; transition: opacity 0.5s; opacity: 0; visibility: hidden;}
#customer_header #gnav:not(:target) { opacity: 0; visibility: hidden;}
#customer_header #gnav:target { opacity: 1; visibility: visible; z-index: 10000;}

#customer_header #gnav .gn_logo{ width: 200px; height: auto; margin: 0 auto;}
#customer_header #gnav .gn_logo img{ width: 100%; height: auto;}
#customer_header #gnav .gn_inner{ padding: 50px 5% 100px; width: 100%; box-sizing: border-box; position: relative; z-index: 2;}
#customer_header #gnav #gn_overlay { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; z-index: 1; }
#customer_header #gnav .gn_nav_01{ column-count: 2; column-gap: 20px; margin: 20px 0 0;}
#customer_header #gnav .gn_nav_01 li{ position: relative; z-index: 1; }
#customer_header #gnav .gn_nav_01 li::after { background-color: #ccc; bottom: 0; content: ""; height: 1px; left: 0; position: absolute; width: 100%; }
#customer_header #gnav .gn_nav_01 li a{ display: block; width: 100%; padding: 15px 0 15px 20px; position: relative; z-index: 2; box-sizing: border-box;}
#customer_header #gnav .gn_nav_01 li a:hover{ text-decoration: none;}
#customer_header #gnav .gn_nav_01 li a::before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 0; margin: auto 0; width: 6px; height: 6px; border-bottom: solid 1px #555; border-right: solid 1px #555; transform: rotate(-45deg);}
#customer_header #gnav .more{ display: block; border-bottom: solid 1px #ccc; padding: 15px 0 15px 20px; position: relative; box-sizing: border-box;}
#customer_header #gnav .more::after{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 3px; margin: auto 0; width: 6px; height: 6px; border-bottom: solid 1px #555; border-right: solid 1px #555; transform: rotate(45deg); transition: all 0.3s;}
#customer_header #gnav .more.active::after{ left: 3px; transform: rotate(-135deg);}
#customer_header #gnav .gn_nav_02{ column-count: 2; column-gap: 20px; margin: 10px 0 0;}
#customer_header #gnav .gn_nav_02 li{ display: inline-block; break-inside: avoid;}
#customer_header #gnav .gn_nav_02 li a{ display: block; width: 100%; padding: 10px 0 10px 15px; position: relative; box-sizing: border-box; font-size: 14px;}
#customer_header #gnav .gn_nav_02 li a:hover{ text-decoration: none;}
#customer_header #gnav .gn_nav_02 li a::before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 0; margin: auto 0; width: 6px; height: 6px; border-bottom: solid 1px #555; border-right: solid 1px #555; transform: rotate(-45deg);}
#customer_header #gnav .gn_tel{ text-align: center; padding: 30px 0 0;}
#customer_header #gnav .gn_tel .tel-link{ font-size: 26px; color: #555;}
#customer_header #gnav .gn_time{ text-align: center; padding: 0 0 30px;}
#customer_header #gnav .gn_sns{ display: flex; justify-content: center;}
#customer_header #gnav .gn_sns a{ display: block; width: 36px; height: 36px; background-repeat: no-repeat; background-position: center center; background-size: 26px; margin: 0 10px; text-indent: 100%; white-space: nowrap; overflow: hidden; box-sizing: border-box;}
#customer_header #gnav .gn_sns a:hover{ opacity: 0.75;}
#customer_header #gnav .gn_sns li a.youtube{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_youtube_01.svg");}
#customer_header #gnav .gn_sns li a.insta{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_insta_01.svg");}
#customer_header #gnav .gn_sns li a.fb{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_fb_01.svg");}
#customer_header #gnav .gn_sns li a.x{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_x_01.svg");}
#customer_header #gnav .gn_sns li a.line{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_line_01.svg");}
#customer_header #gnav .gn_sns li a.tiktok{ background-image:url("https://storage.489ban.net/storage/customer/1075/489ban/ico_tiktok_01.svg"); background-size: 24px;}
#customer_header #gnav .gn_lang{ display: flex; justify-content: center; flex-wrap: wrap; margin: 30px 0 0; font-size: 14px; line-height: 1;}
#customer_header #gnav .gn_lang li{ padding: 5px 10px; position: relative;}
#customer_header #gnav .gn_lang li:first-child{ padding: 5px 10px 5px 25px; background: url("../img/ico_lang_01_g.svg") no-repeat center left; background-size: 18px;}
#customer_header #gnav .gn_lang li::after{ content: ""; width: 1px; height: 14px; background-color: #555; position: absolute; right: 0; top: 0; bottom: 0; margin: auto 0;}
#customer_header #gnav .gn_lang li:last-child::after{ display: none;}

@media screen and (min-width: 601px) {
#customer_header #gnav {  background-color: transparent; }
#customer_header #gnav .gn_logo{ width: 300px;}
#customer_header #gnav .gn_inner{ padding: 100px 50px 50px; width: 700px; height: 100%; min-height: 1100px; margin: 0 0 0 auto; background-color: #fff;}
#customer_header #gnav #gn_overlay { min-height: 1100px; background-color: rgba(0, 0, 0, 0.5);}
#customer_header #gnav .gn_nav_01{ font-size: 18px;}
#customer_header #gnav .gn_nav_01 li a{ padding: 25px 0 25px 20px;}
#customer_header #gnav .more{ display: none;}
#customer_header #gnav .gn_nav_02{ column-count: 3; column-gap: 20px; margin: 30px 0 0;}
#customer_header #gnav .gn_nav_02 li a{ padding: 15px 0 15px 15px; font-size: 16px;}
#customer_header #gnav .gn_tel{ padding: 30px 0 0; font-size: 16px;}
#customer_header #gnav .gn_tel .tel-link{ font-size: 32px;}
#customer_header #gnav .gn_time{ padding: 0 0 30px;}
#customer_header #gnav .gn_sns{ display: flex; justify-content: center;}
#customer_header #gnav .gn_sns a{ width: 42px; height: 42px; background-size: 32px; margin: 0 20px;}
#customer_header #gnav .gn_sns li a.tiktok{ background-size: 30px;}
#customer_header #gnav .gn_lang{ margin: 30px 0 0 20px; font-size: 16px; padding: 0 0 20px;}
}

/* ---------------------------------------------------
Global Footer
------------------------------------------------------ */

#customer_footer #g_footer{ padding: 50px 5% 100px; background-color: #17314f; color: #fff;}
#customer_footer #g_footer address{ margin: 0 !important;}
#customer_footer #g_footer a{ color: #fff; text-decoration: none;}
#customer_footer #g_footer .ft_inner{ display: flex; flex-direction: column; justify-content: center; align-items: flex-start;}
#customer_footer #g_footer .ft_box_01{ width: 100%;}
#customer_footer #g_footer .ft_box_01 address{ text-align: center;}
#customer_footer #g_footer .ft_logo{ width: 230px; margin: 0 auto 20px;}
#customer_footer #g_footer .ft_logo img{ width: 100%; height: auto;}
#customer_footer #g_footer .ft_addr{ font-size: 12px; padding: 0 0 10px;}
#customer_footer #g_footer .ft_tel{ font-size: 15px; padding: 0 0 10px;}
#customer_footer #g_footer .ft_tel .tel-link{ font-size: 26px;}
#customer_footer #g_footer .ft_time{ font-size: 15px; padding: 0 0 5px;}
#customer_footer #g_footer .ft_fax{ font-size: 12px; padding: 0 0 5px;}
#customer_footer #g_footer .ft_fax .num{ font-size: 15px;}
#customer_footer #g_footer .ft_company{ font-size: 12px;}
#customer_footer #g_footer .ft_sns{ display: flex; justify-content: center; padding: 30px 0;}
#customer_footer #g_footer .ft_sns a{ display: block; width: 36px; height: 36px; background-repeat: no-repeat; background-position: center center; background-size: 26px; margin: 0 8px; text-indent: 100%; white-space: nowrap; overflow: hidden; box-sizing: border-box;}
#customer_footer #g_footer .ft_sns a:hover{ opacity: 0.75;}
#customer_footer #g_footer .ft_sns li a.youtube{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_youtube_02.svg");}
#customer_footer #g_footer .ft_sns li a.insta{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_insta_02.svg");}
#customer_footer #g_footer .ft_sns li a.fb{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_fb_02.svg");}
#customer_footer #g_footer .ft_sns li a.x{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_x_02.svg");}
#customer_footer #g_footer .ft_sns li a.line{ background-image: url("https://storage.489ban.net/storage/customer/1075/489ban/ico_line_02.svg");}
#customer_footer #g_footer .ft_sns li a.tiktok{ background-image:url("https://storage.489ban.net/storage/customer/1075/489ban/ico_tiktok_02.svg"); background-size: 24px;}
#customer_footer #g_footer .ft_box_02{ width: 100%;}
#customer_footer #g_footer .ft_tit{ font-size: 12px; padding: 0 0 20px;}
#customer_footer #g_footer .ft_nav{ column-count: 2; column-gap: 20px; font-size: 13px;}
#customer_footer #g_footer .ft_nav li a{ display: block; width: 100%; padding: 10px 0 10px 15px; position: relative; box-sizing: border-box;}
#customer_footer #g_footer .ft_nav li a:hover{ color: #fff; text-decoration: none;}
#customer_footer #g_footer .ft_nav li a.hover_lr::after { background-color: #fff;}
#customer_footer #g_footer .ft_nav li a::before{ content: ""; display: block; position: absolute; top: 0; bottom: 0; left: 0; margin: auto 0; width: 6px; height: 6px; border-bottom: solid 1px #fff; border-right: solid 1px #fff; transform: rotate(-45deg);}
#customer_footer #g_footer .ft_box_03{ display: block; width: 100%; padding: 30px 0 0; text-align: center;}
#customer_footer #g_footer .ft_box_03 .ft_copyright{ font-size: 12px;}

@media screen and (min-width: 601px) {
#customer_footer #g_footer{ padding: 80px 0;}
#customer_footer #g_footer .ft_inner{ width: 100%; max-width: 1200px; margin: 0 auto; flex-direction: row; justify-content: space-between; flex-wrap: wrap;}
#customer_footer #g_footer .ft_box_01{ width: 40%;}
#customer_footer #g_footer .ft_box_01 address{ text-align: left;}
#customer_footer #g_footer .ft_logo{ width: 300px; margin: 0 0 20px;}
#customer_footer #g_footer .ft_logo img{ width: 100%; height: auto;}
#customer_footer #g_footer .ft_addr{ font-size: 16px; padding: 0 0 20px;}
#customer_footer #g_footer .ft_tel{ font-size: 16px; padding: 0 0 10px;}
#customer_footer #g_footer .ft_tel .tel-link{ font-size: 20px;}
#customer_footer #g_footer .ft_time{ font-size: 16px; padding: 0;}
#customer_footer #g_footer .ft_fax{ font-size: 16px; padding: 0 0 5px;}
#customer_footer #g_footer .ft_fax .num{ font-size: 20px;}
#customer_footer #g_footer .ft_company{ font-size: 16px;}
#customer_footer #g_footer .ft_sns{ justify-content: flex-start; padding: 30px 0;}
#customer_footer #g_footer .ft_sns a{ width: 42px; height: 42px; background-size: 32px; margin: 0 8px;}
#customer_footer #g_footer .ft_sns a.insta{ margin: 0 15px 0 0;}
#customer_footer #g_footer .ft_sns a.tiktok{ background-size: 30px;}
#customer_footer #g_footer .ft_box_02{ width: 60%;}
#customer_footer #g_footer .ft_tit{ font-size: 16px; padding: 0 0 10px;}
#customer_footer #g_footer .ft_nav{ column-count: 3; column-gap: 50px; font-size: 16px;}
#customer_footer #g_footer .ft_nav li a{ width: fit-content; padding: 8px 0 8px 15px;}
#customer_footer #g_footer .ft_box_03{ padding: 10px 0 0; text-align: left;}
#customer_footer #g_footer .ft_box_03 .ft_copyright{ font-size: 12px;}
}

/* ---------------------------------------------------
Fixed Navigation (Smartphone only)
------------------------------------------------------ */
#customer_footer .fixed_nav { position: fixed; bottom: 0; left: 0; width: 100%; padding-bottom: env(safe-area-inset-bottom);  display: flex; justify-content: space-between; z-index: 9999;}
#customer_footer .fixed_nav ul{ display: flex; width: calc( 100% - 55px ); height: 50px; background: #fff; z-index: 122;}
#customer_footer .fixed_nav ul li{ width: 50%;}
#customer_footer .fixed_nav ul li a { display: block; padding: 0; text-align: center; font-size: 12px; height: 50px; line-height: 50px; color: #fff !important; text-decoration: none; width: 100%; background-color: #295587; background-repeat: no-repeat; box-sizing: border-box; transition: background-color 0.5s;}
#customer_footer .fixed_nav ul li a:hover{ background-color: #3875ba;}
#customer_footer .fixed_nav ul li.fix_btn_01 a{ background-image: url(https://storage.489ban.net/storage/customer/1075/489ban/ico_cal_01_w.svg); background-position: calc(50% - 2.5em) 50%; background-size: 18px; padding: 0 0 0 1.5em;}
#customer_footer .fixed_nav ul li.fix_btn_02 a{ background-image: url(https://storage.489ban.net/storage/customer/1075/489ban/ico_bag_01_w.svg); background-position: calc(50% - 1.9em) 50%; background-size: 16px; padding: 0 0 0 1.5em; border-left: solid 1px #888 !important;}

@media screen and (min-width: 601px) {
#customer_footer .fixed_nav { height: 100px; width: 100px; position: fixed; top: 0; bottom: inherit; left: inherit; right: 0; justify-content: space-between; z-index: 30;}
#customer_footer .fixed_nav ul{ display: none;}
}
/* ---------------------------------------------------
Side Menu
------------------------------------------------------ */
#customer_footer #sidemenu { box-sizing: border-box; cursor: pointer; height: 50px; width: 55px; background: #13162a; display: block;}
#customer_footer #sidemenu a{ display: block; position: relative; width: 100%; height: 100%;}
#customer_footer #sidemenu a > .bar{ transition: all 0.3s; box-sizing: border-box; position: absolute; height: 1px; width: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; z-index: 2; transform-origin: center center;}
#customer_footer #sidemenu a > .bar::after{ content: ""; height: 1px; width: 25px; display: block; background: #fff; position: absolute; top: 0; left: 0;}
#customer_footer #sidemenu a > .bar:nth-of-type(1) { top: 18px; left: 15px;}
#customer_footer #sidemenu a > .bar:nth-of-type(2) { top: 25px; left: 15px;}
#customer_footer #sidemenu a > .bar:nth-of-type(3) { top: 32px; left: 15px;}

#customer_header #sideclose { box-sizing: border-box; cursor: pointer; position: fixed; z-index: 10000; bottom: 0; right: 0; height: 50px; width: 55px; background: #13162a;}
#customer_header #sideclose a{ color: #fff; display: block; width: 100%; height: 100%;}
#customer_header #sideclose .bar{ transition: all 0.3s; box-sizing: border-box; position: absolute; height: 1px; width: 100%; text-indent: 100%; white-space: nowrap; overflow: hidden; z-index: 2; transfcloseorigin: center center;}
#customer_header #sideclose .bar::after{ content: ""; height: 1px; width: 25px; display: block; background: #fff; position: absolute; top: 0; left: 0;}
#customer_header #sideclose .bar:nth-of-type(1) {  transform: rotate(135deg); top: 36px; left: -10px;}
#customer_header #sideclose .bar:nth-of-type(2) { transform: rotate(-135deg); top: 15px; left: -10px;}

@media screen and (min-width: 601px) {
#customer_footer #sidemenu { height: 100px; width: 100px; transition: all 0.5s;}
#customer_footer #sidemenu a > .bar{ height: 2px;}
#customer_footer #sidemenu a > .bar::after{ height: 2px; width: 40px;}
#customer_footer #sidemenu a > .bar:nth-of-type(1) { top: 40px; left: 30px;}
#customer_footer #sidemenu a > .bar:nth-of-type(2) { top: 50px; left: 30px;}
#customer_footer #sidemenu a > .bar:nth-of-type(3) { top: 60px; left: 30px;}
#customer_footer #sidemenu:hover a > .bar:nth-of-type(3) { width: 30px;}

#customer_header #sideclose { height: 100px; width: 100px; top: 0; bottom: inherit;}
#customer_header #sideclose:hover{ background: #13162a; transition: all, 0.5s;}
#customer_header #sideclose .bar{ height: 2px;}
#customer_header #sideclose .bar::after{ height: 2px; width: 40px;}
#customer_header #sideclose .bar{ height: 2px;}
#customer_header #sideclose .bar::after{ height: 2px;}
#customer_header #sideclose .bar:nth-of-type(1),
#customer_header #sideclose .bar:nth-of-type(2) { top: 50px; left: 30px; width: 40px;}
}