@charset "UTF-8";
/* s5-returnToTop */
.s5-returnToTop__inner1 {
	left: 0;
	right: 0;
}

.s5-returnToTop__inner2 {
	max-width: 1200px;
}

/* alphainfo template stylesheet */
.tpl__alphainfo__header {
    background: #ffffff;
}

.tpl__alphainfo__header--inner {
    width: 93.75%;
    max-width: 1200px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    box-sizing: border-box;
    margin: 0 auto;
}

.tpl__alphainfo__header--logo {
    display: block;
    padding: 15px 0;
    width: 100px;
}

.tpl__alphainfo__header--txt {
    margin-left: auto;
    padding: 14px 0 18px;
    width: 351px;
    line-height: 0;
}

@media (max-width: 959px) {
    .tpl__alphainfo__header--txt {
        width: 300px;
    }
}

@media (max-width: 639px) {
    .tpl__alphainfo__header--logo {
        width: 80px;
    }
    .tpl__alphainfo__header--txt {
        width: 52%;
    }
}

.tpl__alphainfo__academy {
    max-width: 1200px;
    margin: 0 auto;
    background: #efefef;
    color: #000;
}

.tpl__alphainfo__academy--inner {
    padding: 50px 60px 80px 50px;
}

.tpl__alphainfo__academy--txt {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1.67;
}

.tpl__alphainfo__academy--heading {
    background: #ccc;
    padding: 50px 20px 35px;
    text-align: center;
    color: #333;
    font-size: 28px;
    font-size: 1.75rem;
    font-family: "Yu Mincho", YuMincho, "游明朝", "HGS明朝", "HGP明朝", "HG明朝", serif;
    line-height: 1;
}

.tpl__alphainfo__academy--heading--logo {
    display: block;
    margin-top: 16px;
}

.tpl__alphainfo__academy--heading--logo img {
    display: block;
    margin: 0 auto;
}

.tpl__alphainfo__academy--intro--imgbox {
    margin-left: 46px;
    width: 46.1155%;
    max-width: 463px;
    float: right;
}

.tpl__alphainfo__academy--intro--spimgbox {
    display: none;
}

.tpl__alphainfo__academy--intro--heading {
    font-size: 30px;
    font-size: 1.875rem;
    line-height: 1.5;
    letter-spacing: .05em;
    margin-bottom: 30px;
    font-family: "Yu Mincho", YuMincho, "游明朝", "HGS明朝", "HGP明朝", "HG明朝", serif;
}

.tpl__alphainfo__academy--intro::after {
    content: '';
    display: block;
    clear: both;
}

.tpl__alphainfo__academy--course {
    margin-top: 60px;
    display: flex;
    justify-content: space-between;
}

.tpl__alphainfo__academy--course--imgbox {
    flex: 0 0 39.8406;
    max-width: 400px;
}

.tpl__alphainfo__academy--course--txtbox {
    flex: 0 1 auto;
    margin-left: 60px;
}

.tpl__alphainfo__academy--course--boxttl {
    background: #ea5504;
    display: inline-block;
    padding: 6px 20px 5px;
    color: #fff;
    font-size: 18px;
    font-size: 1.125rem;
    letter-spacing: .025em;
    line-height: 1;
}

.tpl__alphainfo__academy--course--tags {
    padding: 0;
    display: flex;
    margin-top: 30px;
    list-style: none;
}

.tpl__alphainfo__academy--course--tags li {
    border: 1px solid;
    padding: 2px 5px 1px;
    line-height: 1.2;
    box-sizing: border-box;
    font-size: 14px;
    font-size: .875rem;
}

.tpl__alphainfo__academy--course--tags li:nth-of-type(n+2) {
    margin-left: 5px;
}

.tpl__alphainfo__academy--course--tags .free {
    border-color: #5887ab;
    color: #5887ab;
}

.tpl__alphainfo__academy--course--tags .beginner {
    border-color: #f9e575;
    background: #f9e575;
    color: #3a3519;
}

.tpl__alphainfo__academy--course--tags .use {
    border-color: #a2bbea;
    color: #000;
}

.tpl__alphainfo__academy--course--tags .teacher {
    border-color: #ec9717;
    color: #6B460E;
}

.tpl__alphainfo__academy--course--heading {
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 1.5;
    letter-spacing: .075em;
    margin-bottom: 16px;
    margin-top: 26px;
}

.tpl__alphainfo__academy--course--spimgbox {
    display: none;
}

.tpl__alphainfo__academy--banner {
    margin-top: 80px;
    text-align: center;
}

.tpl__alphainfo__academy--banner--heading {
    font-size: 30px;
    font-size: 1.875rem;
    letter-spacing: .05em;
    font-family: "Yu Mincho", YuMincho, "游明朝", "HGS明朝", "HGP明朝", "HG明朝", serif;
}

.tpl__alphainfo__academy--banner--link {
    display: block;
    margin-top: 30px;
    transition: 0.2s;
}

.tpl__alphainfo__academy--banner--link:hover, .tpl__alphainfo__academy--banner--link:focus {
    opacity: .6;
}

.tpl__alphainfo__academy--banner--caution {
    margin-top: 16px;
}

@media (max-width: 959px) {
    .tpl__alphainfo__academy--inner {
        padding: 30px 20px 40px;
    }
    .tpl__alphainfo__academy--heading {
        padding: 40px 20px 25px;
    }
    .tpl__alphainfo__academy--heading--logo {
        margin-top: 10px;
        transform: scale(0.8);
    }
    .tpl__alphainfo__academy--intro--heading {
        font-size: 24px;
        font-size: 1.5rem;
        margin-bottom: 20px;
    }
    .tpl__alphainfo__academy--intro--heading br {
        display: none;
    }
    .tpl__alphainfo__academy--intro--imgbox {
        margin-left: 20px;
    }
}

@media (max-width: 639px) {
    .tpl__alphainfo__academy--heading {
        padding: 30px 20px 20px;
    }
    .tpl__alphainfo__academy--heading--logo {
        transform: scale(0.6);
    }
    .tpl__alphainfo__academy--intro--heading {
        font-size: 24px;
        font-size: 1.5rem;
        margin-bottom: 15px;
    }
    .tpl__alphainfo__academy--course {
        margin-top: 40px;
    }
    .tpl__alphainfo__academy--course--imgbox {
        display: none;
    }
    .tpl__alphainfo__academy--course--spimgbox {
        display: block;
        margin-top: 20px;
    }
    .tpl__alphainfo__academy--course--spimgbox img {
        width: 100%;
    }
    .tpl__alphainfo__academy--course--txtbox {
        margin-left: 0;
    }
    .tpl__alphainfo__academy--course--tags {
        margin-top: 20px;
    }
    .tpl__alphainfo__academy--course--heading {
        margin-top: 20px;
    }
    .tpl__alphainfo__academy--banner {
        margin-top: 60px;
    }
    .tpl__alphainfo__academy--banner--link {
        margin-top: 20px;
    }
    .tpl__alphainfo__academy--banner--caution {
        text-align: left;
    }
}

@media (max-width: 479px) {
    .tpl__alphainfo__academy--heading {
        font-size: 22.4px;
        font-size: 1.4rem;
    }
    .tpl__alphainfo__academy--intro--heading {
        font-size: 24px;
        font-size: 1.5rem;
        margin-bottom: 15px;
    }
    .tpl__alphainfo__academy--intro--imgbox {
        display: none;
    }
    .tpl__alphainfo__academy--intro--spimgbox {
        display: block;
        margin-bottom: 20px;
    }
    .tpl__alphainfo__academy--course--tags li {
        font-size: 13px;
        font-size: 0.8125rem;
    }
    .tpl__alphainfo__academy--banner--heading {
        font-size: 24px;
        font-size: 1.5rem;
    }
}

.tpl__alphainfo-asidebox {
    background: #eaeaea;
    color: #333333;
    padding: 70px 0 30px;
}

@media screen and (max-width: 639px) {
    .tpl__alphainfo-asidebox {
        padding: 50px 0 80px;
    }
}

.tpl__alphainfo-store + .tpl__alphainfo-store,
.tpl__alphainfo-store + .tpl__alphainfo-program, .tpl__alphainfo-program + .tpl__alphainfo-store,
.tpl__alphainfo-program + .tpl__alphainfo-program {
    margin-top: 60px;
}

.tpl__alphainfo-store--inner, .tpl__alphainfo-program--inner {
    width: 93.75%;
    max-width: 1200px;
    box-sizing: border-box;
    margin: 0 auto;
}

.tpl__alphainfo-store--heading, .tpl__alphainfo-program--heading {
    text-align: center;
    font-family: "Yu Mincho", YuMincho, "游明朝", "HGS明朝", "HGP明朝", "HG明朝", serif;
    font-size: 38px;
    font-size: 2.375rem;
    line-height: 1.34;
    font-weight: normal;
}

.tpl__alphainfo-store--txt, .tpl__alphainfo-program--txt {
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 1.67;
}

@media screen and (max-width: 959px) {
    .tpl__alphainfo-store--heading, .tpl__alphainfo-program--heading {
        font-size: 30px;
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 479px) {
    .tpl__alphainfo-store--heading, .tpl__alphainfo-program--heading {
        font-size: 24px;
        font-size: 1.5rem;
    }
}

.tpl__alphainfo-store--imgbox {
    margin: 30px 0 50px;
    display: flex;
}

.tpl__alphainfo-store--imgitem {
    flex: 0 0 50%;
}

.tpl__alphainfo-store--list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 50px;
}

.tpl__alphainfo-store--item {
    flex: 0 0 19.167%;
    transition: opacity .25s !important;
}

.tpl__alphainfo-store--item:hover {
    opacity: .8;
}

.tpl__alphainfo-store--name {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.2;
    color: #fff;
    background: #5787e4;
    height: 64px;
}

.tpl__alphainfo-store--name::before {
    content: '';
    display: inline-block;
    position: relative;
    top: -0.1em;
    margin-right: 5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 0 4px 5px;
    border-color: transparent transparent transparent #fff;
}

.tpl__alphainfo-store--store-sp {
    display: none;
}

.tpl__alphainfo-store--img {
    display: block;
}

@media screen and (max-width: 1259px) {
    .tpl__alphainfo-store--name {
        font-size: 1.2vw;
        height: 4.8vw;
    }
}

@media screen and (max-width: 639px) {
    .tpl__alphainfo-store--store-sp {
        display: block;
        margin-top: 30px;
    }
    .tpl__alphainfo-store--list {
        display: none;
    }
    .tpl__alphainfo-store--name {
        font-size: 16px;
        font-size: 1rem;
        height: 48px;
    }
    .tpl__alphainfo-store--imgbox {
        margin: 30px 0;
    }
    .tpl__alphainfo-store--item {
        display: block;
    }
}

@media screen and (max-width: 479px) {
    .tpl__alphainfo-store--name {
        font-size: 14px;
        font-size: 0.875rem;
        height: 40px;
    }
    .tpl__alphainfo-store--imgbox {
        margin: 20px 0;
    }
    .tpl__alphainfo-store--store-sp {
        display: block;
        margin-top: 20px;
    }
}

.tpl__alphainfo-program--box {
    clear: both;
    display: block;
    content: '';
    margin-top: 30px;
}

.tpl__alphainfo-program--img {
    float: right;
    margin: 0 0 0 40px;
    width: 38.584%;
    transition: opacity .2s !important;
}

.tpl__alphainfo-program--img:hover {
    opacity: .8;
}

.tpl__alphainfo-program--btn {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    margin-top: 20px;
    padding: 13px 30px 12px 30px;
    font-size: 13px;
    font-size: 0.8125rem;
    font-weight: bold;
    line-height: 1.2;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #5687f5;
    transition: opacity .2s !important;
}

.tpl__alphainfo-program--btn::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 15px;
    margin-top: -3.5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 3.5px 0 3.5px 4px;
    border-color: transparent transparent transparent #fff;
}

.tpl__alphainfo-program--btn:hover {
    color: #fff;
    opacity: .8;
}

@media screen and (max-width: 639px) {
    .tpl__alphainfo-program--img {
        display: block;
        float: none;
        margin: 0 0 30px;
        width: 100%;
    }
    .tpl__alphainfo-program--btn {
        font-size: 16px;
        font-size: 1rem;
    }
}

@media screen and (max-width: 479px) {
    .tpl__alphainfo-program--img {
        margin: 0 0 20px;
    }
    .tpl__alphainfo-program--box {
        margin-top: 20px;
    }
    .tpl__alphainfo-program--btn {
        font-size: 14px;
        font-size: 0.875rem;
    }
}

/* End alphainfo template stylesheet */
/* survey template stylesheet */
.tpl__survey {
    background: #fff;
    color: #444;
}

.tpl__survey--inner {
    max-width: 950px;
    width: 93.75%;
    margin: 0 auto;
    padding: 50px 0;
    text-align: center;
}

.tpl__survey--heading {
    font-size: 38px;
    font-size: 2.375rem;
    letter-spacing: .06em;
    line-height: 1.33;
}

.tpl__survey--txt {
    font-size: 18px;
    font-size: 1.125rem;
    letter-spacing: .06em;
    font-weight: 500;
    margin-top: 30px;
    line-height: 1.77;
}

.tpl__survey--linkbtn {
    font-size: 28px;
    font-size: 1.75rem;
    font-weight: bold;
    margin-top: 40px;
    display: block;
    color: #fff;
    background: #5787e4;
    padding: 16px;
    text-decoration: none;
    transition: 0.2s !important;
    line-height: 1.25;
}

.tpl__survey--linkbtn:hover, .tpl__survey--linkbtn:focus {
    color: #fff;
    background: #8aacf6;
}

@media screen and (max-width: 959px) {
    .tpl__survey--heading {
        font-size: 30px;
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 639px) {
    .tpl__survey--inner {
        width: 90.625%;
    }
    .tpl__survey--txt {
        text-align: left;
    }
    .tpl__survey--linkbtn {
        font-size: 20px;
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 479px) {
    .tpl__survey--inner {
        padding: 34px 0;
    }
    .tpl__survey--heading {
        font-size: 24px;
        font-size: 1.5rem;
    }
    .tpl__survey--txt {
        margin-top: 20px;
    }
    .tpl__survey--linkbtn {
        margin-top: 26px;
        font-size: 18px;
        font-size: 1.125rem;
    }
}

/* End survey template stylesheet */
@font-face {
    font-family: "alphainfo";
    src: url("../fonts/alphainfo.eot?jetd94");
    src: url("../fonts/alphainfo.eot?jetd94#iefix") format("embedded-opentype"), url("../fonts/alphainfo.ttf?jetd94") format("truetype"), url("../fonts/alphainfo.woff?jetd94") format("woff"), url("../fonts/alphainfo.svg?jetd94#alphainfo") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

i {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: "alphainfo" !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icf-alpha:before {
    content: "\e900";
    font-family: "alphainfo" !important;
    speak: none;
}

html {
    font-family: YuGothic, '游ゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,sans-serif;
}

.alpha {
    /*font-family: 'Noto Serif JP', "Yu Mincho", YuMincho, "游明朝", "HGS明朝", "HGP明朝", "HG明朝", serif;*/
    font-size: 1.2em;
}

.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
}

.tpl__alphainfo__header {
    padding: 0 30px;
}

.tpl__alphainfo__header--logo {
    padding: 18px 0;
}

body {
    background: #f4f4f4;
	min-width: 320px;
}

.contents {
    max-width: 1200px;
    margin: 0 auto;
    background: #fff;
}

img {
    max-width: 100%;
    vertical-align: top;
}

@media screen and (min-width: 640px) {
    .sp {
        display: none;
    }
}

.pc {
    display: none;
}

@media screen and (min-width: 640px) {
    .pc {
        display: block;
    }
}

.has-border {
    position: relative;
}

.has-border .border-outer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: '';
    display: block;
    box-sizing: border-box;
    padding: 4.21%;
}

.has-border .border {
    box-sizing: border-box;
    display: block;
    height: 100%;
    border: 1px solid #fff;
}

.mv {
    position: relative;
    color: #333;
	background: #a990c2;
}

.mv .has-border .border-outer {
    padding: 2.34375%;
}

@media screen and (min-width: 640px) {
    .mv .has-border .border-outer {
        padding: 1.25%;
    }
}

.mv .has-border .border {
    border-width: 2px;
}

.mv .title,
.mv .subtitle {
    position: absolute;
    left: 0;
    width: 100%;
}

@media screen and (min-width: 640px) {
    .mv .title,
    .mv .subtitle {
        position: static;
    }
}

@media screen and (min-width: 640px) {
    .mv .text-box {
        position: absolute;
        top: 9.5vw;
        left: 0;
        width: 46.666%;
        margin-left: 5%;
    }
}

@media screen and (min-width: 1200px) {
    .mv .text-box {
        top: 114px;
        width: 560px;
    }
}

.mv .title {
    text-align: center;
    top: 5.9375%;
    line-height: 1;
}

.mv .title .top,
.mv .title .bottom {
    display: block;
    letter-spacing: .2em;
}

.mv .title .top {
    font-size: 7.5vw;
}

@media screen and (min-width: 640px) {
    .mv .title .top {
        font-size: 4vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .title .top {
        font-size: 48px;
        font-size: 3rem;
    }
}

.mv .title .bottom {
    margin-top: 2.1875vw;
    font-size: 7.8125vw;
}

@media screen and (min-width: 640px) {
    .mv .title .bottom {
        font-size: 4.166vw;
        margin-top: 1.666vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .title .bottom {
        font-size: 50px;
        font-size: 3.125rem;
        margin-top: 20px;
    }
}

.mv .title .number {
    font-size: 11.25vw;
}

@media screen and (min-width: 640px) {
    .mv .title .number {
        font-weight: bold;
        font-size: 6vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .title .number {
        font-size: 72px;
        font-size: 4.5rem;
    }
}

.mv .title .de {
    font-size: 5.9375vw;
}

@media screen and (min-width: 640px) {
    .mv .title .de {
        font-size: 3.166vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .title .de {
        font-size: 38px;
        font-size: 2.375rem;
    }
}

.mv .title .icf-alpha {
    font-size: 6.875vw;
}

@media screen and (min-width: 640px) {
    .mv .title .icf-alpha {
        font-size: 3.666vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .title .icf-alpha {
        font-size: 44px;
        font-size: 2.75rem;
    }
}

.mv .title .no {
    font-size: 6.25vw;
}

@media screen and (min-width: 640px) {
    .mv .title .no {
        font-size: 3.333vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .title .no {
        font-size: 40px;
        font-size: 2.5rem;
    }
}

.mv .subtitle {
    bottom: 7.5%;
    display: flex;
    justify-content: center;
}

@media screen and (min-width: 640px) {
    .mv .subtitle {
        margin-top: 11.666vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .subtitle {
        margin-top: 140px;
    }
}

.mv .subtitle .inner {
	padding: 0 20px;
	text-align: center;
    width: 100%;
    display: flex;
    align-items: center;
	justify-content: center;
}

@media screen and (min-width: 640px) {
    .mv .subtitle .inner {
        padding: 0;
        display: block;
        text-align: center;
    }
}

.mv .text {
	flex: 0 1 auto;
	text-align: center;
    font-size: 4.7vw;
    line-height: 1.2;
    letter-spacing: .1em;
	margin-left: 3%;
	color: #222222;
	font-weight: bold;
}

@media screen and (min-width: 640px) {
    .mv .text {
        font-size: 2.5vw;
		flex: 0 0 100%;
		margin-left: 0;
    }
}

@media screen and (min-width: 1200px) {
    .mv .text {
        font-size: 30px;
        /*font-size: 1.875rem;*/
		font-size: 2.1rem;
    }
}

.mv .text .small {
    font-size: 3.76vw;
	margin-left: .1em;
}

@media screen and (min-width: 640px) {
    .mv .text .small {
        font-size: 1.75vw;
    }
}

@media screen and (min-width: 1200px) {
    .mv .text .small {
        font-size: 21px;
        font-size: 1.3125rem;
    }
}

.section + .section {
    margin-top: 60px;
}

@media screen and (min-width: 640px) {
    .section + .section {
        margin-top: 100px;
    }
}

.sec-pickup.section {
	margin-top: 0px;
}

.section p {
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: .05em;
    line-height: 1.8;
    padding: 20px 4.6875% 40px;
}

@media screen and (min-width: 360px) {
    .section p {
        font-size: 17px;
        font-size: 1.25rem;
    }
}

@media screen and (min-width: 375px) {
    .section p {
        font-size: 17px;
        font-size: 1.25rem;
    }
}

@media screen and (min-width: 480px) {
    .section p {
        padding: 40px 4.6875% 75px;
        font-size: 19px;
        font-size: 1.25rem;
    }
}

@media screen and (min-width: 640px) {
    .section p {
        text-align: center;
        font-size: 22px;
        font-size: 1.375rem;
        padding: 50px 30px 100px;
    }
}

.section p.intro-text {
    padding: 20px 9.375% 40px;
}

@media screen and (min-width: 480px) {
    .section p.intro-text {
        padding: 75px 9.375%;
    }
}

@media screen and (min-width: 640px) {
    .section p.intro-text {
        padding: 100px 30px;
    }
}

.section p.youtube-text {
    color: #fff;
    background: #000;
    padding: 30px 4.6875vw;
}

@media screen and (min-width: 480px) {
    .section p.youtube-text {
        padding: 40px 4.6875vw;
    }
}

@media screen and (min-width: 640px) {
    .section p.youtube-text {
        padding: 30px 30px 0;
        background: #fff;
        color: inherit;
    }
}

.section p.acafe-text {
    padding: 30px 4.6875vw;
}

@media screen and (min-width: 480px) {
    .section p.acafe-text {
        padding: 40px 4.6875vw;
    }
}

@media screen and (min-width: 640px) {
    .section p.acafe-text {
        padding: 50px 30px;
    }
}

.section .img-box {
    max-width: 800px;
    margin: 0 auto;
    position: relative;
}

.section .img-box.horizontal {
    max-width: 640px;
}

.section .img-box .youtube {
    width: 100%;
    position: relative;
    padding-top: 56.25%;
}

.section .img-box .youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.section .imgBox__zoom {
    position: relative;
    display: block;
    pointer-events: none;
}

@media screen and (min-width: 640px) {
    .section .imgBox__zoom {
        pointer-events: auto;
    }
}

.section .imgBox__zoom .zoom-btn {
    display: none;
}

@media screen and (min-width: 640px) {
    .section .imgBox__zoom .zoom-btn {
        display: block;
        position: absolute;
        bottom: 8px;
        right: 8px;
    }
}

.section-title img {
    display: block;
}

.section-title .top {
    display: flex;
    justify-content: center;
}

.section-title .top .logo {
    flex: 0 0 8.625vw;
}

@media screen and (min-width: 480px) {
    .section-title .top .logo {
        flex: 0 0 7.1875vw;
    }
}

@media screen and (min-width: 640px) {
    .section-title .top .logo {
        flex: 0 0 46px;
    }
}

.section-title .top .text {
    flex: 0 0 52.875vw;
}

.section-title .top .logo + .text {
	margin-left: 5vw;
}

.section-title .top .text img {
    width: 100%;
}

@media screen and (min-width: 480px) {
    .section-title .top .text {
        flex: 0 0 44.0625vw;
    }
}

@media screen and (min-width: 640px) {
    .section-title .top .text {
        flex: 0 0 283px;
    }

	.section-title .top .logo + .text {
        margin-left: 32px;
    }
}

.sec-glens .section-title .top {
	margin: 0 auto;
	max-width: 295.86px;
	align-items: center;
	width: 55.4737vw;
}

.sec-pickup .section-title .top {
	margin: 0 auto;
	max-width: 191px;
	align-items: center;
	width: 35.8125vw;
}

.sec-recommend .section-title .top {
	margin: 0 auto;
	max-width: 337px;
	align-items: center;
	width: 63.1875vw;
}

.sec-glens .section-title .top .logo {
	flex: 0 1 87.86px;
	max-width: 87.86px;
}

.sec-glens .section-title .top .text {
	flex: 0 1 176px;
	max-width: 176px;
}

.sec-pickup .section-title .top .text,
.sec-recommend .section-title .top .text {
	flex: 0 0 100%;
	max-width: 100%;
}

.section-title .subtitle {
    font-size: 3.75vw;
    text-align: center;
    padding: 0;
    margin-top: 20px;
    line-height: 1.33;
    color: #999999;
}

@media screen and (min-width: 480px) {
    .section-title .subtitle {
        font-size: 3.125vw;
    }


	.sec-glens .section-title .top {
		width: 46.228vw;
	}

	.sec-pickup .section-title .top {
		width: 29.84375vw;
	}

	.sec-recommend .section-title .top {
		width: 52.65625vw;
	}
}

@media screen and (min-width: 640px) {
    .section-title .subtitle {
        font-size: 18px;
        font-size: 1.125rem;
    }
}

.section-title.acafe .text {
    width: 39.9375vw;
    margin: 0 auto;
}

@media screen and (min-width: 480px) {
    .section-title.acafe .text {
        width: 33.28125vw;
    }
}

@media screen and (min-width: 640px) {
    .section-title.acafe .text {
        width: 213px;
    }
}

.zeiss-box,
.gmaster-box,
.pickup-box {
    max-width: 640px;
    padding: 0 4.6875vw;
    margin: 30px auto 0;
}

@media screen and (min-width: 640px) {
    .zeiss-box,
	.gmaster-box,
	.pickup-box {
        padding: 0 30px;
    }
}

.zeiss-box .inner,
.gmaster-box .inner,
.pickup-box .inner {
    background: #f1f1f1;
}

@media screen and (min-width: 640px) {
    .zeiss-box .inner,
	.gmaster-box .inner,
	.pickup-box .inner {
        padding: 50px 30px 30px;
    }
}

.zeiss-box p,
.gmaster-box p,
.pickup-box p {
    padding: 30px 4.6875vw 15px;
    text-align: left;
}

@media screen and (min-width: 480px) {
    .zeiss-box p
	.gmaster-box p,
	.pickup-box p {
        padding: 40px 4.6875vw 20px;
    }
}

@media screen and (min-width: 640px) {
    .zeiss-box p,
 	.gmaster-box p,
	.pickup-box p {
        padding: 0;
        margin-bottom: 30px;
    }
}

.btn-wrap {
    max-width: 640px;
    padding: 0 9.375vw;
    margin: 0 auto;
}

@media screen and (min-width: 640px) {
    .btn-wrap {
        padding: 0 60px;
    }
}

.linkbtn,
.store-btn,
.store-link {
    background: #ccc;
    text-align: center;
    color: inherit;
    transition: .3s !important;
    border-radius: 50px;
    text-decoration: none;
    font-weight: bold;
    position: relative;
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 10px 4.6875vw;
    line-height: 1.5;
    font-size: 3vw;
}

@media screen and (min-width: 480px) {
    .linkbtn,
    .store-btn,
    .store-link {
        font-size: 2.5vw;
    }
}

@media screen and (min-width: 640px) {
    .linkbtn,
    .store-btn,
    .store-link {
        padding: 20px 30px;
        font-size: 16px;
        font-size: 1rem;
    }
}

@media screen and (min-width: 1200px) {
    .linkbtn,
    .store-btn,
    .store-link {
        font-size: 18px;
        font-size: 1.125rem;
    }
}

.linkbtn:hover, .linkbtn:focus,
.store-btn:hover,
.store-btn:focus,
.store-link:hover,
.store-link:focus {
    color: inherit;
    background: #e6e6e6;
}

.linkbtn::before,
.store-btn::before,
.store-link::before {
    position: absolute;
    top: 50%;
    left: 6.25vw;
    transform: translateY(-50%);
    content: '';
    border-style: solid;
    border-width: 3.5px 0 3.5px 3.5px;
    border-color: transparent transparent transparent #333;
}

@media screen and (min-width: 375px) {
    .linkbtn::before,
    .store-btn::before,
    .store-link::before {
        border-width: 4.5px 0 4.5px 4.5px;
    }
}

@media screen and (min-width: 640px) {
    .linkbtn::before,
    .store-btn::before,
    .store-link::before {
        border-width: 7px 0 7px 7px;
        left: 40px;
    }
}

.sec-acafe .img-box {
    margin-top: 20px;
}

.sec-lens {
    padding-bottom: 30px;
}

@media screen and (min-width: 640px) {
    .sec-lens {
        background: #f1f1f1;
        padding-bottom: 60px;
    }
}

.sec-lens .inner {
    max-width: 640px;
    padding: 0 4.6875vw;
    text-align: center;
}

@media screen and (min-width: 640px) {
    .sec-lens .inner {
        position: relative;
        margin: 0 auto;
    }
}

.sec-lens .bg {
    margin: 0 4.6875vw;
    background: #f1f1f1;
    padding: 6.25vw 4.6875vw;
}

@media screen and (min-width: 640px) {
    .sec-lens .bg {
        margin: 0 auto;
        background: transparent;
        padding: 0;
    }
}

.sec-lens .product {
    position: relative;
}

@media screen and (min-width: 640px) {
    .sec-lens .product {
        background: #f1f1f1;
        padding: 40px 0 0px;
    }
}

.sec-lens .product .img-box {
    padding-top: 12px;
}

.gmaster-lens .product .img-box {
	padding-top: 16vw;
}

@media screen and (min-width: 640px) {
    .sec-lens .product .img-box {
        position: relative;
    }

	.gmaster-lens .product .img-box {
		padding-top: 60px;
	}
}

.sec-lens .product .img-box .lens {
    width: 38.59375vw;
    transform: translateX(-1.5625vw);
}

@media screen and (min-width: 640px) {
    .sec-lens .product .img-box .lens {
        width: 290px;
        transform: translateX(-10px);
    }
}

.sec-lens .product .glens {
    position: absolute;
    top: 0;
    right: 1.5625vw;
    width: 11.1vw;
}

@media screen and (min-width: 640px) {
    .sec-lens .product .glens {
        width: 71px;
        right: 72px;
    }
    .sec-lens .product .glens img {
		width:100%; /* IE 11 */
    }
}

.sec-lens .title {
    font-size: 21px;
    font-size: 1.3125rem;
    margin-top: 20px;
}

@media screen and (min-width: 480px) {
    .sec-lens .title {
        font-size: 24px;
        font-size: 1.5rem;
        margin-top: 30px;
    }
}

@media screen and (min-width: 640px) {
    .sec-lens .title {
        font-size: 32px;
        font-size: 2rem;
        margin-top: 40px;
    }
}

.sec-lens .name {
    padding: 0;
    margin: 5px 0 10px;
    font-size: 16px;
    font-size: 1rem;
    font-weight: bold;
}

@media screen and (min-width: 480px) {
    .sec-lens .name {
        font-size: 18px;
        font-size: 1.125rem;
    }
}

.sec-lens .price {
    padding: 0;
    font-size: 16px;
    font-size: 1rem;
    line-height: 1.2;
    font-weight: bold;
}

.sec-lens .price .small {
    font-size: 14px;
    font-size: 0.875rem;
}

@media screen and (min-width: 480px) {
    .sec-lens .price {
        font-size: 18px;
        font-size: 1.125rem;
    }
    .sec-lens .price .small {
        font-size: 15px;
        font-size: 0.9375rem;
    }
}

.btns {
    margin-top: 30px;
}

@media screen and (min-width: 640px) {
    .btns {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 40px;
    }
}

.store-btn {
    color: #fff;
    flex: 0 1 auto;
}

.store-btn::before {
    border-color: transparent transparent transparent #fff;
}

.store-btn.about {
    background: #5787f4;
}

.store-btn.about:hover, .store-btn.about:focus {
    color: #fff;
    background: #8aacf6;
}

.store-btn.buy {
    margin-top: 10px;
    background: #ea5504;
}

@media screen and (min-width: 640px) {
    .store-btn.buy {
        margin-left: 20px;
        margin-top: 0;
    }
}

.store-btn.buy:hover, .store-btn.buy:focus {
    color: #fff;
    background: #f7886c;
}

aside .subtitle {
    font-size: 3.75vw;
    text-align: center;
    padding: 0 !important;
    margin-top: 20px;
    line-height: 1.33;
    color: #999999;
}

@media screen and (min-width: 480px) {
    aside .subtitle {
        font-size: 3.125vw;
    }
}

@media screen and (min-width: 640px) {
    aside .subtitle {
        font-size: 18px;
        font-size: 1.125rem;
    }
}

.aplaza {
    padding: 60px 0;
    margin: 0 4.6875vw;
}

@media screen and (min-width: 640px) {
    .aplaza {
        padding: 90px 0;
    }
}

.aplaza .inner {
    max-width: 640px;
    margin: 0 auto;
}

.aplaza .title {
    width: 44.625vw;
    margin: 0 auto;
}

@media screen and (min-width: 480px) {
    .aplaza .title {
        width: 37.1875vw;
    }
}

@media screen and (min-width: 640px) {
    .aplaza .title {
        width: 238px;
    }
}

.aplaza .images {
    display: flex;
    margin-top: 20px;
}

@media screen and (min-width: 640px) {
    .aplaza .images {
        margin-top: 30px;
    }
}

.aplaza .images .img {
    flex: 0 0 50%;
    max-width: 50%;
}

.aplaza p {
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: .05em;
    line-height: 1.8;
    padding: 15px 4.6875% 25px;
}

@media screen and (min-width: 375px) {
    .aplaza p {
        font-size: 17px;
        font-size: 1.0625rem;
    }
}

@media screen and (min-width: 480px) {
    .aplaza p {
        font-size: 19px;
        font-size: 1.1875rem;
    }
}

@media screen and (min-width: 640px) {
    .aplaza p {
        text-align: center;
        font-size: 22px;
        font-size: 1.375rem;
        padding: 30px 30px 50px;
    }
}

.aplaza .store-list {
    display: flex;
    flex-wrap: wrap;
    padding: 0;
    list-style: none;
}

.aplaza .store-item {
    flex: 0 0 48%;
}

.aplaza .store-item:nth-of-type(even) {
    margin-left: 4%;
}

.aplaza .store-item:nth-of-type(n+3) {
    margin-top: 2%;
}

.aplaza .store-link {
    text-align: center;
    padding-left: 6.25vw;
    font-size: 2.8vw;
}

.aplaza .store-link::before {
    left: 3.125vw;
}

@media screen and (min-width: 480px) {
    .aplaza .store-link {
        font-size: 2.333vw;
        padding-left: 9.375vw;
		text-align: left;
    }
    .aplaza .store-link::before {
        left: 4.6875vw;
    }
}

@media screen and (min-width: 640px) {
    .aplaza .store-link {
        font-size: 18px;
        font-size: 1.125rem;
        padding-left: 80px;
    }
    .aplaza .store-link::before {
        left: 40px;
    }
}

.recommend .title {
    max-width: 292px;
    margin: 0 auto;
    width: 65.0625vw;
}

@media screen and (min-width: 480px) {
    .recommend .title {
        width: 54.21875vw;
    }
}

.recommend-contents {
    margin-top: 20px;
    padding: 0;
    list-style: none;
}

@media screen and (min-width: 640px) {
    .recommend-contents {
        display: flex;
        flex-wrap: wrap;
        margin-top: 30px;
    }
}

.recommend-content:nth-of-type(n+2) {
    border-top: 1px solid #fff;
}

@media screen and (min-width: 640px) {
    .recommend-content {
        flex: 0 0 50%;
        max-width: 50%;
    }
}

.recommend-link {
    display: flex;
    align-items: center;
    background: #f1f1f1;
    transition: .3s all !important;
    text-decoration: none;
    color: inherit;
}

.recommend-link:hover, .recommend-link:focus {
    opacity: .7;
    color: inherit;
}

.recommend-link .img-box {
    flex: 0 0 47.5%;
}

.recommend-link .text-box {
    flex: 1 1 auto;
    padding: 4.6875vw;
}

@media screen and (min-width: 640px) {
    .recommend-link .text-box {
        padding: 20px;
    }
}

.recommend-link h3 {
    line-height: 1.5;
}

.recommend-link .top,
.recommend-link .bottom {
    display: block;
}

.recommend-link .top {
    font-weight: normal;
    font-size: 2.8vw;
}

@media screen and (min-width: 640px) {
    .recommend-link .top {
        font-size: 15px;
        font-size: 0.9375rem;
    }
}

@media screen and (min-width: 1200px) {
    .recommend-link .top {
        font-size: 20px;
        font-size: 1.25rem;
    }
}

.recommend-link .bottom {
    margin-top: 10px;
    font-size: 5vw;
}

@media screen and (min-width: 640px) {
    .recommend-link .bottom {
        font-size: 18px;
        font-size: 1.125rem;
    }
}

@media screen and (min-width: 1200px) {
    .recommend-link .bottom {
        font-size: 28px;
        font-size: 1.75rem;
    }
}

.tpl__survey {
    background: #eaeaea;
    margin-top: 0px;
}

@media screen and (min-width: 640px) {
    .tpl__survey {
        margin-top: 0px;
    }
}

.sec-recommend .img-box {
	margin-top: 20px;
}

/*--- portal link ---*/
.portal {
    padding: 15px 0 60px;
    margin: 0 4.6875vw;
}

@media screen and (min-width: 640px) {
    .portal{
        padding: 0px 0  90px;
    }
}

.portal .inner {
    max-width: 640px;
    margin: 0 auto;
}

.portal .title {
    width: 68vw;
    margin: 0 auto;
}

@media screen and (min-width: 480px) {
    .portal .title {
        width: 40vw;
    }
}

@media screen and (min-width: 640px) {
    .portal .title {
        width: 360px;
    }
}

.portal .images {
    margin-top: 20px;
}

@media screen and (min-width: 640px) {
    .portal .images {
        margin-top: 30px;
    }
}

.portal p {
    font-size: 14px;
    font-size: 0.875rem;
    letter-spacing: .05em;
    line-height: 1.8;
    padding: 15px 4.6875% 25px;
}

@media screen and (min-width: 375px) {
    .portal p {
        font-size: 17px;
        font-size: 1.0625rem;
    }
}

@media screen and (min-width: 480px) {
    .portal p {
        font-size: 19px;
        font-size: 1.1875rem;
    }
}

@media screen and (min-width: 640px) {
    .portal p {
        text-align: center;
        font-size: 22px;
        font-size: 1.375rem;
        padding: 30px 30px 50px;
    }
}

/* -- alpha logo IE11 hack --*/
.ie {
	display: none;
}

@media all and (-ms-high-contrast: none) {
	.ie {
		display: inline-block;
	}

	.no-ie {
		display: none;
	}

	.ie-alpha {
		height: 17.6px;
		padding-right: 10px;
		margin-top: -4px;
	}
}

@media all and (-ms-high-contrast: none) and (min-width: 320px) {
	.ie-alpha {
		height: 6.8vw;
		padding-right: 1.5vw;
		margin-top: 0vw;
	}
}

@media all and (-ms-high-contrast: none) and (min-width: 640px) {
	.ie-alpha {
		height: 4.125vw;
		padding-right: 1.5vw;
		margin-top: -0.5vw;
	}
}

@media all and (-ms-high-contrast: none) and (min-width: 1200px) {
	.ie-alpha {
		height: 45.4px;
		margin-top: 0;
		padding-right: 15px;
	}
}

/* 追加css */
.has-bg.point {
	background-image: url(../img/bg_icon.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 60%;
	padding-top: 18.75vw;
	max-width: 640px;
	margin: 0 auto;
	padding-bottom: 4.6875vw;
}

.has-bg.point .point-title {
	text-align: center;
	padding: 0 4.6875%;
	color: #694c9c;
	letter-spacing: .05em;
	font-size: 1.3125rem;
	line-height: 1.125;
}

@media screen and (min-width: 360px) {
	.has-bg.point .point-title {
		font-size: 1.875rem;
	}
}

@media screen and (min-width: 640px) {
	.has-bg.point {
		padding-top: 120px;
		padding-bottom: 30px;
	}

	.has-bg.point .point-title {
		font-size: 2.0625rem;
	}
}

.img-box-title {
	color: #694c9c;
	letter-spacing: .05em;
	font-size: 1.125rem;
	display: flex;
	justify-content: center;
	align-items: center;
}

.img-box-title .img {
	display: inline-block;
}

.img-box-title .img.num1 {
	max-width: 34px;
	width: 17px;
}

.img-box-title .img.num2 {
	max-width: 38.5px;
	width: 19.25px;
}

.img-box-title .img.num3 {
	max-width: 39px;
	width: 19.5px;
}

.img-box-title .img.num4 {
	max-width: 41.5px;
	width: 20.75px;
}

.img-box-title .img.num5 {
	max-width: 38.5px;
	width: 19.25px;
}

.img-box-title .text {
	margin-left: .5em;
}


.img-box-title + .img-box {
	margin-top: 20px;
}

@media screen and (min-width: 360px) {
	.img-box-title {
		font-size: 1.25rem;
	}
	.img-box-title .img.num1 {
		width: 20.4px;
	}

	.img-box-title .img.num2 {
		width: 23.1px;
	}

	.img-box-title .img.num3 {
		width: 23.4px;
	}

	.img-box-title .img.num4 {
		width: 24.9px;
	}

	.img-box-title .img.num5 {
		width: 23.1px;
	}
}

@media screen and (min-width: 480px) {
	.img-box-title + .img-box {
		margin-top: 40px;
	}
}

@media screen and (min-width: 640px) {
	.img-box-title {
		font-size: 1.875rem;
	}

	.img-box-title + .img-box {
		margin-top: 50px;
	}

	.img-box-title .img.num1,
	.img-box-title .img.num2,
	.img-box-title .img.num3,
	.img-box-title .img.num4,
	.img-box-title .img.num5 {
		width: 100%;
	}
}

.img-box .img-caption-on {
	position: absolute;
	bottom: 20px;
	left: 20px;
	color: #fff;
	font-size: 7.5vw;
	font-weight: bold;
	padding: 0;
	line-height: 1;
	letter-spacing: 0;
	text-shadow: 0px 0px 20.88px rgba(8, 2, 3, 0.44);
}

.img-box .img-caption {
	padding: 0 20px 10px;
	margin-top: 10px;
	text-align: center;
}

.img-box + .img-box {
	margin-top: 10px;
}

@media screen and (min-width: 480px) {
	.img-box + .img-box {
		margin-top: 20px;
	}
}

@media screen and (min-width: 640px) {
	.img-box .img-caption-on {
		font-size: 3rem;
	}
	.img-box .img-caption {
		margin-top: 20px;
		padding-bottom: 20px;
	}
}

.point-text-box {
	margin: 0 20px;
}

.point-text-box + .img-box-title {
	margin-top: 30px;
}

.point-text-box p {
	padding: 30px 20px;
	border: 3px solid #694c9c;
	border-radius: 10px;
	text-align: center;
	max-width: 640px;
	margin: 0 auto;
	box-sizing: border-box;
	background: #f1f1f2;
	color: #333333;
	font-weight: bold;
}

@media screen and (min-width: 640px) {
	.point-text-box + .img-box-title {
		margin-top: 75px;
	}
}

strong {
	color: #694c9c;
	font-size: 1em;
}

.outro {
	margin: 30px auto 0;
	background-image: url(../img/bg_icon.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	background-size: 60%;
	padding: 23.4375vw 0;
	max-width: 640px;
	margin-bottom: 20px;
}

.outro p {
	padding: 0;
	text-align: center;
	color: #694c9c;
	font-weight: bold;
	line-height: 1.84;
	letter-spacing: .1em;
}

@media screen and (min-width: 640px) {
	.outro {
		padding: 150px 0;
		margin-bottom: 40px;
	}
}

/* 追記2021.02.07 */
.img-box + .f-length {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 640px;
	margin: 0 auto;
	padding: 5px 4.6875% 20px;
	font-weight: bold;
}

.f-length .img {
	width: 46px;
}

.f-length .text {
	margin-left: 10px;
}

.f-length + p {
	padding-top: 0;
}

@media screen and (min-width: 360px) {
	.f-length .img {
		width: 68px;
	}
}

@media screen and (min-width: 640px) {
	.img-box + .f-length {
		padding: 10px 30px 40px;
	}
	.f-length .img {
		width: 136px;
	}

	.f-length .text {
		margin-left: 20px;
	}
}

.section p.has_btn {
	padding-bottom: 25px;
}

p.caption {
	letter-spacing: .05em;
	padding: 0 4.6875%;
	max-width: 640px;
	margin: 0 auto;
	text-align: left;
}

p.caption span {
	color: #694c9c;
	font-size: 1.25rem;
	font-weight: bold;
	letter-spacing: .1em;
}

.img-box + p.caption {
	margin-top: 20px;
}

.img-box + .img-box-title,
.btn-wrap + .img-box-title,
p.caption + .img-box-title {
	margin-top: 60px;
}

.graybox {
	max-width: 640px;
	margin: 30px auto 0;
	padding: 0 4.6875%;
}

.graybox-inner {
	padding: 20px 4.6875%;
	background: #f1f1f1;
}

.graybox-title {
	font-size: 1.25rem;
	text-align: center;
}

.graybox-inner p {
	padding: 0;
	margin-top: 20px;
	text-align: left;
}

.graybox + .btn-wrap {
	margin-top: 30px;
}

@media screen and (min-width: 480px) {
	.img-box + p.caption {
		margin-top: 40px;
	}
	.graybox {
		margin-top: 40px;
	}
	.graybox + .btn-wrap {
		margin-top: 40px;
	}
	.graybox-inner {
		padding: 30px 4.6875%;
	}
	.graybox-inner p {
		margin-top: 30px;
	}
}

@media screen and (min-width: 640px) {
	.section p.has_btn {
		padding-bottom: 50px;
	}
	p.caption {
		padding: 0 30px;
	}
	p.caption span {
		font-size: 1.58125rem;
	}
	.img-box + p.caption {
		margin-top: 50px;
	}
	.img-box + .img-box-title,
	.btn-wrap + .img-box-title,
	p.caption + .img-box-title {
		margin-top: 100px;
	}
	.graybox {
		margin-top: 50px;
	}
	.graybox-inner {
		padding: 40px 30px;
	}
	.graybox-title {
		font-size: 1.375rem;
	}
	.graybox + .btn-wrap {
		margin-top: 60px;
	}
}