@charset "UTF-8";

/* sass */
.l-body.nolnav + .wrap-page-top .page-top.pageTopFixed { bottom: 67px; }

.wrap-chatbot-btn { z-index: 5; position: relative; }

.wrap-chatbot-btn .inner-chatbot-btn { position: fixed; bottom: 116px; right: 8px; font-size: 0; line-height: 0; width: 64px; height: 64px; background: transparent url(/shared/image/chatbot_btn.png) no-repeat center center; background-size: contain; }

.wrap-chatsupport-content { font-family: "Noto Sans JP"; z-index: 5; position: relative; }

.wrap-chatsupport-content .chatsupport-btn { position: fixed; bottom: 170px; right: 0; background-color: #1432AA; border-radius: 4px 0 0 4px; padding: 40px 16px 16px; color: #fff; font-size: 1.6rem; line-height: 1; font-weight: 700; min-width: 48px; }

.wrap-chatsupport-content .chatsupport-btn span { position: relative; display: block; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }

.wrap-chatsupport-content .chatsupport-btn span:before { content: ""; display: block; width: 24px; height: 24px; background: transparent url(/shared/image/chatbot_icon_baloon.svg) no-repeat center center; background-size: contain; position: absolute; top: -30px; left: 50%; margin-left: -12px; }

.wrap-chatsupport-content #karte-chat-panel { position: fixed; bottom: 170px; right: 64px; background-color: #fff; border: 1px solid #1432A9; border-radius: 4px; box-shadow: 0px 3px 6px -1px rgba(0, 0, 0, 0.4); width: 263px; transition: -webkit-transform .6s; transition: transform .6s; transition: transform .6s, -webkit-transform .6s; -webkit-transform: translateX(340px); transform: translateX(340px); }

.wrap-chatsupport-content #karte-chat-panel dl { position: relative; }

.wrap-chatsupport-content #karte-chat-panel dl dt { background-color: #EEEFF3; border-radius: 4px 4px 0 0; padding: 12px 40px 12px 16px; line-height: 1.4; font-size: 1.4rem; color: #333333; }

.wrap-chatsupport-content #karte-chat-panel dl dd { padding: 12px; }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li { font-size: 1.6rem; font-weight: 700; line-height: 1.4; border: 1px solid #666666; }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li + li { margin-top: 8px; }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li a { display: flex; align-items: center; position: relative; padding: 10px 34px 10px 8px; color: #333333; text-decoration: none; }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li a:before { content: ""; width: 32px; height: 32px; margin-right: 8px; display: block; background: no-repeat center center; background-size: contain; }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li a:after { right: 18px; top: 50%; margin-top: -2px; content: ''; display: block; position: absolute; width: 4px; height: 4px; border-top: 2px solid #1432aa; border-left: 2px solid #1432aa; -webkit-transform: translateX(0) translateY(0); transform: translateX(0) translateY(0); transition: -webkit-transform .2s; transition: transform .2s; transition: transform .2s, -webkit-transform .2s; -webkit-transform: rotate(135deg); transform: rotate(135deg); }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li a.icon1:before { background-image: url(/shared/image/chatbot_icon_pengin.svg); }

.wrap-chatsupport-content #karte-chat-panel .menu-list > li a.icon2:before { background-image: url(/shared/image/chatbot_icon_faq.svg); }

.wrap-chatsupport-content #karte-chat-panel .chatsupport-close { position: absolute; right: 8px; top: 10px; font-size: 0; line-height: 0; display: block; width: 24px; height: 24px; background: transparent url(/shared/image/chatbot_icon_close.svg) no-repeat center center; background-size: contain; }

.open-chat-panel .wrap-chatsupport-content #karte-chat-panel { -webkit-transform: translateX(0); transform: translateX(0); }

#alli-container { z-index: 2147483650 !important; position: relative; }

@media print, all and (min-width: 768px) { .l-body.nolnav + .wrap-page-top .page-top.pageTopFixed { bottom: 67px; }
  .wrap-page-top .page-top { bottom: 18px; } .wrap-chatsupport-content .chatsupport-btn { bottom: 160px; }
  .wrap-chatsupport-content #karte-chat-panel { bottom: 160px; }
  .wrap-chatsupport-content #karte-chat-panel .menu-list > li a:hover:after { -webkit-transform: translateX(3px) translateY(0) rotate(135deg); transform: translateX(3px) translateY(0) rotate(135deg); } }