.wizard-desc { text-align: center; } .wizard-steps-container { margin-bottom: 1em; } .btn-wizard-steps-ctrl { border-radius: 0.5em; } .wizard-steps { margin: 1em; font-size: 0.85em; } .wizard-steps .wizard-steps-element { height: 1.5em; padding-left: 1.5em; padding-top: 0.1em; padding-right: 1em; margin-right: 0.3em; margin-top: 0.1em; margin-bottom: 0.3em; background: #efefef; position: relative; display: inline-block; } .wizard-steps .wizard-steps-element:before { width: 0; height: 0; border-top: calc(1.5em / 2) inset transparent; border-bottom: calc(1.5em / 2) inset transparent; border-left: calc(1.5em / 2) solid #fff; position: absolute; content: ""; top: 0; left: 0; height: 1.5em; } .wizard-steps .wizard-steps-element:after { width: 0; height: 0; border-top: calc(1.5em / 2) inset transparent; border-bottom: calc(1.5em / 2) inset transparent; border-left: calc(1.5em / 2) solid #efefef; position: absolute; content: ""; top: 0; right: calc(-1 * 1.5em / 2); z-index: 2; height: 1.5em; } .wizard-steps .wizard-steps-element:first-child { padding-left: 1em; border-radius: 0.5em 0 0 0.5em; } .wizard-steps .wizard-steps-element:last-child { border-radius: 0 0.5em 0.5em 0; } .wizard-steps .wizard-steps-element:first-child:before, .wizard-steps .wizard-steps-element:last-child:after { border: none; } .wizard-steps .wizard-steps-element a { color: white; } .wizard-steps .wizard-steps-finished { background: #5cb85c; color: #fff; } .wizard-steps .wizard-steps-finished:after { border-left-color: #5cb85c; } .wizard-steps .wizard-steps-current { background: tomato; color: #fff; } .wizard-steps .wizard-steps-current:after { border-left-color: tomato; } .searchbox .zoom-enter-active { -webkit-animation: zoom-in .1s; animation: zoom-in .1s; } .searchbox .zoom-leave-active { animation: zoom-in .1s reverse; } @-webkit-keyframes zoom-in { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes zoom-in { 0% { -webkit-transform: scale(0); transform: scale(0); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @media (min-width: 992px) { .searchbox .padding-left-0-md { padding-left: 0; } .searchbox .padding-right-0-md { padding-right: 0; } } .searchbox .color-bright { color: lightgrey; } .searchbox.dark-background { background-color: rgba(0, 0, 0, 0.5); padding: 1em 1em 0 1em; border-radius: .5em; } #navbar { font-family: "Montserrat", Lucida Grande, Arial, Meiryo, Hiragino Maru Gothic Pro, verdana, "Trebuchet MS", Helvetica, sans-serif; background-color: #ffffffe3; border-bottom: solid 2px #5cb85c; } #navbar .navbar-brand { color: #5cb85c; } #navbar .navbar-brand-img { padding-top: 8px; padding-bottom: 8px; padding-right: 4px; } #navbar .navbar-brand-img img { height: 30px; } #navbar .navbar-brand-txt { margin-left: 0; padding-left: 0; } #navbar #nav-links a { color: #555; } #navbar #nav-links .active a { background-color: #a5f0a5; border-radius: 3px; } #navbar #nav-links .nav-group-gray { border-radius: 3px; background-color: #7b7b7b40; margin: 1px 5px; } @media (max-width: 767px) { #navbar #nav-links .nav-group-gray { margin: 8px 5px; } } #navbar #nav-links .nav-notice-container { padding-top: 0; padding-bottom: 0; border-radius: 3px; margin: 4px; background-color: #f0f0f0; } #footer { font-family: "Montserrat", Lucida Grande, Arial, Meiryo, Hiragino Maru Gothic Pro, verdana, "Trebuchet MS", Helvetica, sans-serif; background-color: #5cb85c; } #footer a button, #footer a img { margin: 5px; } #footer hr { border-color: white; } #footer #footer-image-container { background-color: white; } #footer #footer-image { width: 95%; margin-bottom: -17px; height: auto; } #footer #footer-image-ground { height: 40px; background-color: #86cf86; } #footer .footer-content { color: white; } #footer .footer-content a { color: white; } #footer .footer-main-link-btn { width: 15em; } #footer .footer-links-list { list-style: none; line-height: 2.5em; } @media (max-width: 767px) { #footer .footer-links-list { -webkit-padding-start: 20px; padding-inline-start: 20px; } } #footer .footer-links-list li { display: inline; white-space: nowrap; } #footer .footer-links-list li:not(:last-child):after { content: '\A0|\A0'; } .review-cards { overflow-x: scroll; overflow-y: hidden; white-space: nowrap; } .review-cards .review-card { display: inline-block; vertical-align: top; width: 13em; margin: 1em; border-radius: 5px; -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); white-space: normal; } .review-cards .review-card a { text-decoration: none; } .review-cards .review-card .review-card-img { border-top-left-radius: 5px; border-top-right-radius: 5px; } .review-cards .review-card .review-card-body { padding: 1em; } .review-cards .review-card .review-card-body:hover { text-decoration: none; } .review-cards .review-card .review-card-body .review-card-rating { height: 25px; } .review-cards .review-card .review-card-body .review-card-review { height: 5.6em; color: #333333; font-size: 14px; margin-bottom: 0; } .review-cards .review-card .review-card-body .review-card-additional-info { color: #777777; } .hide-scrollbar::-webkit-scrollbar { display: none; } .styled-scrollbar::-webkit-scrollbar { height: 12px; } .styled-scrollbar::-webkit-scrollbar-track { background: #fff; border: none; border-radius: 10px; -webkit-box-shadow: inset 0 0 2px #777; box-shadow: inset 0 0 2px #777; } .styled-scrollbar::-webkit-scrollbar-thumb { background: #5cb85c; border-radius: 10px; -webkit-box-shadow: none; box-shadow: none; } .card { border-radius: 5px; -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2); white-space: normal; } .card-img { border-top-left-radius: 5px; border-top-right-radius: 5px; } .special-tabs { padding: 1em; width: 100%; } .special-tab-selector { margin-bottom: 0.5em; } .special-tab { height: 43em; } .special-tabs .margin-1em { margin: 1em; } .special-tabs .full-width { width: 100%; } .special-tabs .text-emphasized { color: orangered; font-size: 1.25em; font-weight: bold; } .special-tab.active { -webkit-filter: drop-shadow(5px 10px 10px rgba(0, 0, 0, 0.75)); filter: drop-shadow(5px 10px 10px rgba(0, 0, 0, 0.75)); } .special-tab-title { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; text-orientation: upright; padding: 1em 0.8em 1em 1em; width: 3em; height: 100%; } .special-tab-title-ie { -webkit-writing-mode: tb-rl; -ms-writing-mode: tb-rl; writing-mode: tb-rl; } .special-tab-body { padding: 1em 0 1em 1em; height: 100%; } .special-tab.active .special-tab-body { display: block; width: calc(100% - 1em); } .special-tab:not(.active) .special-tab-body { display: none; } .special-tab-body-background { position: relative; height: 100%; width: 100%; background-size: cover; background-position: center; filter: blur(2px); -webkit-filter: blur(2px); -moz-filter: blur(2px); -o-filter: blur(2px); -ms-filter: blur(2px); } .special-tab-body-content { position: relative; top: -100%; height: 100%; width: 100%; } .special-tab-body-section { width: 80%; margin: 1em auto; padding: 1em; text-align: center; } .special-tab-point { text-align: center; border-radius: 10px; background-color: rgba(255, 255, 255, 0.8); padding: 0.3em 0em; margin: 0 auto .5em auto; font-weight: bold; font-size: 16px; display: inline-block; width: 90%; -webkit-box-sizing: border-box; box-sizing: border-box; } .special-tab-search-btn { width: 10em; } .special-tab-body-section a { text-decoration: none; } .special-tab-catchcopy { font-size: 32px; margin-top: 50px; margin-bottom: 30px; } .special-tab-switcher { font-size: 18px; font-weight: bold; display: block; } .special-tab-switcher:hover { color: #d3d3d3; cursor: pointer; } .special-tabs .color-snow { color: snow; } .special-tabs .color-1 { color: #338984; } .special-tabs .color-2 { color: #fbae00; } .special-tabs .color-3 { color: #da5353; } .special-tabs .color-4 { color: #693f7b; } .special-tabs .color-5 { color: #39589a; } .special-tabs .bgcolor-white { background-color: white; } .special-tabs .bgcolor-1 { background-color: #338984; } .special-tabs .bgcolor-2 { background-color: #fbae00; } .special-tabs .bgcolor-3 { background-color: #da5353; } .special-tabs .bgcolor-4 { background-color: #693f7b; } .special-tabs .bgcolor-5 { background-color: #39589a; } .special-tabs .border-snow { border: 1px solid snow; } .special-tabs .border-1 { border: 1px solid #338984; } .special-tabs .border-2 { border: 1px solid #fbae00; } .special-tabs .border-3 { border: 1px solid #da5353; } .special-tabs .border-4 { border: 1px solid #693f7b; } .special-tabs .border-5 { border: 1px solid #39589a; } .special-tabs .textshadow-1 { color: snow; text-shadow: #338984 1px 1px 1px, #338984 -1px -1px 1px, #338984 -1px 1px 1px, #338984 1px -1px 1px, #338984 0 1px 1px, #338984 0 -1px 1px, #338984 -1px 0 1px, #338984 1px 0 1px; } .special-tabs .textshadow-2 { color: snow; text-shadow: #fbae00 1px 1px 1px, #fbae00 -1px -1px 1px, #fbae00 -1px 1px 1px, #fbae00 1px -1px 1px, #fbae00 0 1px 1px, #fbae00 0 -1px 1px, #fbae00 -1px 0 1px, #fbae00 1px 0 1px; } .special-tabs .textshadow-3 { color: snow; text-shadow: #da5353 1px 1px 1px, #da5353 -1px -1px 1px, #da5353 -1px 1px 1px, #da5353 1px -1px 1px, #da5353 0 1px 1px, #da5353 0 -1px 1px, #da5353 -1px 0 1px, #da5353 1px 0 1px; } .special-tabs .textshadow-4 { color: snow; text-shadow: #693f7b 1px 1px 1px, #693f7b -1px -1px 1px, #693f7b -1px 1px 1px, #693f7b 1px -1px 1px, #693f7b 0 1px 1px, #693f7b 0 -1px 1px, #693f7b -1px 0 1px, #693f7b 1px 0 1px; } .special-tabs .textshadow-5 { color: snow; text-shadow: #39589a 1px 1px 1px, #39589a -1px -1px 1px, #39589a -1px 1px 1px, #39589a 1px -1px 1px, #39589a 0 1px 1px, #39589a 0 -1px 1px, #39589a -1px 0 1px, #39589a 1px 0 1px; } .shadow-a { text-shadow: 2px 1px 0 #000; } .special-tab-body-section a:hover { -webkit-box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.5); box-shadow: 5px 10px 20px rgba(0, 0, 0, 0.5); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .special-tab-body-section a:active { -webkit-box-shadow: none; box-shadow: none; opacity: 0.8; } .special-tab-body-section-a { padding-right: 5px; padding-left: 5px; } .shadow-b { text-shadow: 2px 1px 0 #fff; } div.searchbox.dark-background { background-color: inherit; } .background-screen { background-color: rgba(0, 0, 0, 0.5); } @media (max-width: 767px) { .special-tab.active { width: 100%; } .special-tab:not(.active) { display: none; } .special-tab-body { padding: 1em; } .special-tab.active .special-tab-body { width: 100%; } .special-tab-point { border-radius: 5px; padding: 0.3em 0.7em; width: 100%; font-size: 12px; } .special-tab-catchcopy { font-size: 20px; margin-top: 10px; margin-bottom: 5px; } .special-tab-body-section { width: 95%; margin: 0.5em auto; } } @media screen and (min-width: 768px) and (max-width: 992px) { .special-tab-point { font-size: 12px; } .special-tab-body-section { width: 90%; margin: 0.5em auto; } } @media screen and (min-width: 993px) and (max-width: 1199px) { .special-tab-point { font-size: 14px; } } @media (max-width: 768px) { .appvh { min-height: calc(100vw * (500/800) + 110px); } .apptsvh { min-height: 290px; } } .badge-danger { background-color: tomato; color: snow; } .horizontal-padding-15px { padding-right: 15px; padding-left: 15px; } .inherit-background-color { background-color: inherit; } .width100 { width: 100%; } @media (max-width: 768px) { .no-margin-xs { margin: 0; } } @media (min-width: 768px) { .width100-wo-xs { width: 100%; } } .animation-bowncing { -webkit-animation: bowncing 10s ease infinite; animation: bowncing 10s ease infinite; } @-webkit-keyframes bowncing { 0% { -webkit-transform: scale(1); transform: scale(1); } 5% { -webkit-transform: scale(1.1); transform: scale(1.1); } 10% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes bowncing { 0% { -webkit-transform: scale(1); transform: scale(1); } 5% { -webkit-transform: scale(1.1); transform: scale(1.1); } 10% { -webkit-transform: scale(1); transform: scale(1); } } .no-padding { padding: 0; } .no-list-style { list-style: none; } .horizontal-padding-7px { padding-right: 7px; padding-left: 7px; } .no-margin { margin: 0; } .padding-5px { padding: 5px; } .font-size-1em { font-size: 1em; } .inherit-color { color: inherit; } .inherit-background-color { background-color: inherit; } .full-width { width: 100%; } .inline-block { display: inline-block; }