@charset "utf-8";


/*@media screen and (max-width: 959px) {*/
/*    !* ************************************************************ *!*/
/*    !* 共通 *!*/
/*    !* ************************************************************ *!*/
/*}*/
html, body {
    margin: 0;
    padding: 0;
    color: #1A1919;
    font-size: 5vw;
    font-family: "Hiragino Kaku Gothic ProN";
    scroll-behavior: smooth;
}

body {
    background-image: url('img/bg.png');
    background-repeat: repeat;
}

/*#bg_dev {*/
/*    display: none;*/
/*    position: absolute;*/
/*    background-image: url(img/LP_kizuku.jpg);*/
/*    background-repeat: no-repeat;*/
/*    background-position: left top;*/
/*    background-size: contain;*/
/*    width: 100vw;*/
/*    height: 2000vw;*/
/*}*/

.pc {
    display: none;
}

.anchor {
    position: relative;
    top: -10rem;
}

.white-space-pre-line {
    white-space: pre-line;
}

#wrapper {
    position: relative;
    /* max-width: 960px; */
    /* margin: auto; */
    /*background-image: url('img/bg.png');*/
    /*background-repeat: repeat;*/
}

#page_top {
    width: 9vw;
    height: 9vw;
    position: fixed;
    right: 3vw;
    bottom: 3vw;
    opacity: 0.6;
    z-index: 100;
}

#page_top:before,
#page_top:after {
    font-weight: 900;
    content: ' ';
    font-size: 50px;
    color: #ffffff;
    position: absolute;
    top: 60%;
    left: 50%;
    translate: -50% -50%;
    border-top: 2px solid #121212;
    border-right: 2px solid #121212;
    height: 5vw;
    width: 5vw;
    transform: rotate(-45deg);
}

#page_top:after {
    top: 95%;;
}

header h1 #title_a,
header h1 #title_exclamation,
header #fukidashi_1,
header #fukidashi_2,
header #fukidashi_3,
header #fukidashi_4,
header #title_kizuku_1k,
header #title_kizuku_2i,
header #title_kizuku_3z,
header #title_kizuku_4u,
header #title_kizuku_5k,
header #title_kizuku_6u,
main .kousinjouhou,
main .content .scbool_flow .icons .icon,
main .title#kijihen,
main .title#eizouhen {
    /*main .content .title#inochino,*/
    /*main .content .title#jibungoto {*/
    position: absolute;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    font-size: 0;
}

header {
    position: relative;
    top: 0;
    left: 0;
    /*height: 215vw;*/
    height: 195vw;
}

header h1 {
    margin: 0;
}

header h1 #title_a {
    background-image: url(img/a.png);
    top: 50vw;
    left: 27.6vw;
    height: 37.1vw;
    width: 35.2vw;
    transition-duration: 0.5s;
    /*transform: rotateX(50deg) rotateY(35deg) rotateZ(30deg) scale(1.5);*/
    transform: rotate(300deg) scale(5);
    opacity: 0;
}

header h1 #title_exclamation {
    background-image: url(img/!.png);
    top: 47.9vw;
    left: 59.1vw;
    height: 47.1vw;
    width: 35.2vw;
    transition-duration: 0.5s;
    transform: translateY(-1000vw);
    opacity: 0;
}

header h1 #title_a.show,
header h1 #title_exclamation.show {
    /*transform: rotateX(0deg) rotateZ(0deg) rotateZ(0deg) translateY(0) scale(1) ;*/
    transform: rotate(0deg) translateY(0) scale(1);
    opacity: 1;
}

header #fukidashi_1,
header #fukidashi_2,
header #fukidashi_3,
header #fukidashi_4 {
    /*transition-duration: 0.5s;*/
    opacity: 0;
}

header #fukidashi_1.show,
header #fukidashi_2.show,
header #fukidashi_3.show,
header #fukidashi_4.show {
    animation: flowitem 0.5s forwards;
    /*animation-delay: 0.2s !important;*/
}

header #fukidashi_1 {
    background-image: url(img/fukidashi1.png);
    top: 13.6vw;
    left: 5.7vw;
    height: 39.8vw;
    width: 41.2vw;
    animation-delay: 0.45s !important;
}

header #fukidashi_2 {
    background-image: url(img/fukidashi2.png);
    top: 2.5vw;
    left: 53.7vw;
    height: 39.8vw;
    width: 35.3vw;
    animation-delay: 0.55s !important;
}

header #fukidashi_3 {
    background-image: url(img/fukidashi3.png);
    top: 134.7vw;
    left: 2.3vw;
    height: 45.8vw;
    width: 46.5vw;
    animation-delay: 0.65s !important;
}

header #fukidashi_4 {
    background-image: url(img/fukidashi4.png);
    top: 132.3vw;
    left: 52.8vw;
    height: 44.5vw;
    width: 39vw;
    animation-delay: 0.75s !important;
}


header #title_kizuku_1k,
header #title_kizuku_2i,
header #title_kizuku_3z,
header #title_kizuku_4u,
header #title_kizuku_5k,
header #title_kizuku_6u {
    /*transition-duration: 0.5s;*/
    opacity: 0;

}

header #title_kizuku_1k.show,
header #title_kizuku_2i.show,
header #title_kizuku_3z.show,
header #title_kizuku_4u.show,
header #title_kizuku_5k.show,
header #title_kizuku_6u.show {
    /*transition-duration: 0.5s;*/
    /*opacity: 1;*/
    animation: flowitem 0.5s forwards;
    /*animation-delay: 0.2s !important;*/
}


header #title_kizuku_1k {
    background-image: url(img/K.png);
    top: 85.9vw;
    left: 8.5vw;
    height: 17.8vw;
    width: 17.5vw;
    animation-delay: 0.25s !important;
}

header #title_kizuku_2i {
    background-image: url(img/I.png);
    top: 85.9vw;
    left: 20.1vw;
    height: 17.8vw;
    width: 17.5vw;
    animation-delay: 0.35s !important;
}

header #title_kizuku_3z {
    background-image: url(img/Z.png);
    top: 85.9vw;
    left: 31.7vw;
    height: 17.8vw;
    width: 18vw;
    animation-delay: 0.55s !important;
}

header #title_kizuku_4u {
    background-image: url(img/U.png);
    top: 85.9vw;
    left: 44vw;
    height: 17.8vw;
    width: 17.5vw;
    animation-delay: 0.65s !important;
}

header #title_kizuku_5k {
    background-image: url(img/K.png);
    top: 85.9vw;
    left: 55.8vw;
    height: 17.8vw;
    width: 17.5vw;
    animation-delay: 0.85s !important;
}

header #title_kizuku_6u {
    background-image: url(img/U.png);
    top: 85.9vw;
    left: 67.9vw;
    height: 17.8vw;
    width: 17.5vw;
    animation-delay: 0.95s !important;
}

header .message {
    display: block;
    position: relative;
    padding-top: 106.5vw;
    margin-left: auto;
    margin-right: auto;
    width: 15em;
    font-size: 4vw;
    font-weight: bold;
    transition-delay: 1s;
    transition-duration: 0.5s;
    opacity: 0;
    color: white;
    /* text-shadow: #000000 2px 0px, #000000 -2px 0px, #000000 0px -2px, #000000 0px 2px, #000000 2px 2px, #000000 -2px 2px, #000000 2px -2px, #000000 -2px -2px, #000000 1px 2px, #000000 -1px 2px, #000000 1px -2px, #000000 -1px -2px, #000000 2px 1px, #000000 -2px 1px, #000000 2px -1px, #000000 -2px -1px; */
    text-shadow: #000000 3px 0px, #000000 -3px 0px, #000000 0px -3px, #000000 0px 3px, #000000 3px 3px, #000000 -3px 3px, #000000 3px -3px, #000000 -3px -3px, #000000 1px 3px, #000000 -1px 3px, #000000 1px -3px, #000000 -1px -3px, #000000 3px 1px, #000000 -3px 1px, #000000 3px -1px, #000000 -3px -1px;
    line-height: 1.8em;
}

header .message.show {
    opacity: 1;
}

footer {
    position: relative;
    opacity: 0;
    transition-delay: 1s;
    transition: opacity 0.5s;
    margin: 6rem 0 5rem;
}

footer.show {
    opacity: 1;
    transition: 0s;
}

footer .footerlink {
    width: 90vw;
    margin-bottom: 5rem;
    margin: 0 auto 10vw;
    display: block;
    position: relative;
}

footer .footerlink p {
    margin: 0;
    font-size: 3.5vw;
}

footer .footerlink a {
    width: 90vw;
    display: block;
    vertical-align: top;
    position: relative;
}

footer .footerlink a img {
    max-width: 100%;
}

footer .publisher,
footer .copyright {
    font-size: 16px;
    text-align: center;
    margin-top: 5rem;
    border-top: 1px solid #858080;
    padding-top: 2rem;
}

footer .publisher {
    padding: 0.5rem 0;
    font-size: 20px;
}

footer .copyright {
    margin-top: 0;
}

main {
    opacity: 0;
    transition-delay: 1.5s;
    transition: 0.5s;
}

main.show {
    opacity: 1;
    /*transition: 0s;*/
}

main h2,
main h3 {
    margin: 0;
    opacity: 0;
    z-index: 100;
}

main h3.show {
    animation: scaleFadeIn 0.5s ease-out forwards;
    opacity: 1;
}

main .kousinjouhou {
    background-image: url(img/fukudashi_shikaku.png);
    top: 0;
    left: 10.8vw;
    height: calc(30vw - 1.1em);
    width: calc(76vw - 1rem);
    display: block;
    position: relative;
    font-size: 0.9rem;
    padding: 0.5rem;
    line-height: 2em;
    line-height: 2em;
}

main .kousinjouhou a {
    color: initial;
    text-decoration: none;
}

main .kousinjouhou a:hover {
    text-decoration: underline;
}

main #why {
    width: calc(90% - 2em);
    margin: 0 auto 5em;
    background-color: #F7F7F7;
    padding: 1em;
    font-size: 16px;
}

main #why_description,
main #why_image {
    /*display: inline-block;*/
    position: relative;
    /*width: 49%;*/
    /*vertical-align: middle;*/
}

main #why_image {
    text-align: center;
}

main #why_image #why_image_photo {
    background-image: url(img/why_image_photo.webp);
    width: 80vw;
    height: 50vw;
    background-position: center;
    background-size: cover;
    vertical-align: middle;
    background-repeat: no-repeat;
    margin: 0 auto 0.5em;
}

main #why h2 {
    opacity: 1;
    font-size: 20px;
    font-weight: bold;
    border-bottom: 1px solid #070707;
    padding-bottom: 0.3em;
    margin-bottom: 0.4em;
}

main .title {
}


main .title#kijihen,
main .title#eizouhen {
    height: 15.6vw;
    width: 35vw;
    position: relative;
    margin: 4vw auto 2vw;
    background-position: center;
}

main .title#kijihen {
    background-image: url(img/kijihen.png);
}

main .title#eizouhen {
    background-image: url(img/eizouhen.png);
}

#map_section_sp {
    /*display: flex;*/
    display: block;
    /*flex-wrap: nowrap;*/
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch; /* iOSでの滑らかなスクロール用 */
    position: relative;
    scrollbar-width: none;
}

#swipeicon {
    position: absolute;
    display: block;
    width: 100vw;
    height: 42vw;
    margin-top: -78vw;
    background-image: url(img/swipeicon.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

#map_section {
    position: relative;
    height: 24rem;
}

#map_section_title,
#map_section_caption {
    opacity: 1;
    text-align: center;
    font-size: 18px;
}

#map_section .caption {
    font-size: 16px;
}

#mapimage {
    position: relative;
    background-image: url(img/map-fukushima.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 150%;
    height: 100%;
    opacity: 0.3;
}

div.map_pin,
a.map_pin {
    position: absolute;
    top: 0;
    left: 0;
    color: black;
}

a.map_pin:hover .name {
    background-color: #B4D0D2;
    font-weight: bold;
}

a.map_pin#pin_azumajhs:hover .name,
a.map_pin#pin_ousejhs:hover .name {
    background-color: #F3F2B1;
}

.map_pin .point {
    position: absolute;
    display: block;
    border: 0.4rem solid #72B5C8;
    border-radius: 0.4rem;
    width: 0;
    height: 0;
    z-index: 10;
}

.map_pin .point_center {
    border: 0.2rem solid #fff;
    border-radius: 0.2rem;
    width: 0;
    height: 0;
    display: block;
    position: absolute;
    top: 0.2rem;
    left: 0.2rem;
    z-index: 20;
}

.map_pin .line1 {
    position: absolute;
    border-bottom: 0.1rem solid #333;
    margin: -0.5rem 0 0 -1.8rem;
    width: 2.6rem;
    transform: rotate(45deg);
}

.map_pin .name {
    position: absolute;
    margin: -2.8rem 0 0 -12.4rem;
    display: block;
    background-color: rgba(255, 255, 255, 0.8);
    font-size: 1rem;
    line-height: 1.4em;
    border-bottom: 0.1rem solid #333;
}

.map_pin.example#pin_example_kiji .point {
    border-color: #E7E66B;
}

.map_pin.example .name {
    margin: 0 0 0 1em;
    line-height: 1;
    width: 2em;
    border: navajowhite;
    top: -0.1em;
}

.map_pin.example#pin_example_movie,
.map_pin.example#pin_example_kiji {
    /*top: 37rem;*/
    /*left: 43rem;*/
    top: 18rem;
    left: 11.5rem;
}

.map_pin.example#pin_example_kiji {
    /*top: 39.5rem;*/
    top: 19.5rem;
}

.map_pin#pin_denshoukan .point {
    border-color: #59c3e1;
}

.map_pin#pin_denshoukan .name {
    text-decoration: none;
    border: none;
    font-size: 0.8rem;
    text-align: center;
    margin: -1.2rem 0 0 -4.9rem;
    width: 7em;
    position: absolute;
}

.map_pin#pin_denshoukan {
    top: 11.1rem;
    left: 26.8rem;
}

.map_pin#pin_nakamura1jhs {
    top: 4.4rem;
    left: 25.5rem;
}

.map_pin#pin_azumajhs {
    top: 4.6rem;
    left: 18.2rem;
}

.map_pin#pin_nakamura1jhs .name {
    background-color: #B4D0D2;
}

.map_pin#pin_nakamura1jhs:hover .name,
.map_pin#pin_fukushima3rdjhs:hover .name,
.map_pin#pin_inawashirojhs:hover .name {
    background-color: #B4D0D2;
}


.map_pin#pin_azumajhs .point,
.map_pin#pin_ousejhs .point {
    border-color: #E7E66B;
}

.map_pin#pin_azumajhs .line1 {
    transform: rotate(-20deg);
    margin-top: 0.7rem;
    margin-left: -1.6rem;
    width: 2rem;
}

.map_pin#pin_azumajhs .name {
    background-color: #F3F2B1;
    margin-top: -0.4rem;
    margin-left: -10.4rem;
}

.map_pin#pin_fukushima3rdjhs {
    top: 4.1rem;
    left: 19.7rem;
}

.map_pin#pin_fukushima3rdjhs .line1 {
    transform: rotate(55deg);
    margin-top: 1.6rem;
    margin-left: -0.2rem;
    width: 3rem;
}

.map_pin#pin_fukushima3rdjhs .name {
    background-color: #B4D0D2;
    width: 11.5em;
    margin-top: 1.4rem;
    margin-left: 2.1rem;
}

.map_pin#pin_ousejhs {
    top: 11.5rem;
    left: 17.7rem;
}

.map_pin#pin_inawashirojhs {
    top: 9rem;
    left: 14.8rem;
}

.map_pin#pin_inawashirojhs .name {
    background-color: #B4D0D2;
}


.map_pin#pin_ousejhs .line1 {
    transform: rotate(-45deg);
    margin-top: 1.3rem;
}

.map_pin#pin_ousejhs .name {
    background-color: #F3F2B1;
    margin-top: 0.8rem;
    margin-left: -10.4rem;
}

main .content_sheet {
    display: block;
    position: relative;
    background-color: #FFFFFE;
    padding: 5vw 0 1vw;
    margin: 10vw 0;
}

main .content {
    position: relative;
    display: block;
}

main .content.eizou {
    margin-bottom: 10rem;
}

main .content.kiji {

}

main .content .title {

}

main .content .title,
main .content .title#inochino,
main .content .title#jibungoto {
    position: relative;
    background-position: center bottom;
    margin: 6vw auto 2.5vw;
    height: 27.8vw;
    width: 60%;
}
main .content .title#gakushu {
    height: 1.5em;
    padding-top: 2.5em;
}
main .content .title:before,
main .content .title#inochino:before {
    content: " ";
    position: absolute;
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    background-image: url(img/fukidashi_a.png);
    top: -0.3vw;
    left: -11.6vw;
    height: 17vw;
    width: 34vw;
}

main .content .title.movie:before {
    background-image: url(img/fukidashi_b2-min.png);
}

main .content .title#inochino {
    /*background-image: url(img/inochino.png);*/
}

main .content .title#inochino:before,
main .content .title#koudouhenoippo:before,
main .content .title#jibungoto:before,
main .content .title#manabi:before {
    top: -3.5rem;
}

main .content .title#inochino,
main .content .title#koudouhenoippo {
    text-shadow: 2px 2px 2px #EEEA5B;
    top: 4rem;
}

main .content .title.movie {
    text-shadow: 2px 2px 2px #23ddfb;
    font-size: 150%;
}

main .content .title#jibungoto {
    /*background-image: url(img/jibungoto.png);*/
    height: 45vw;
    top: 4rem;
}

main .content .scbool_flow {
    color: #020604;
    width: 85vw;
    margin: 5vw auto;
    padding-bottom: 5vw;
    opacity: 0;
    transition-duration: 0.2s;
}

main .content .scbool_flow.show {
    opacity: 1;
}

main .content.kiji .scbool_flow {
    background-color: #E7E66B;
}

main .content.eizou .scbool_flow {
    background-color: #72B5C8;
}

main .content .scbool_flow .name {
    position: relative;
    display: block;
    padding: 3.4vw 0 3.4vw 4vw;
    font-weight: bold;
    opacity: 0;
}

main .content.kiji .scbool_flow .name {
    background-color: #F3F2B1;
}

main .content.eizou .scbool_flow .name {
    background-color: #B4D0D2;
}

main .content .scbool_flow .lerningprogram {
    position: relative;
    display: block;
    padding: 3.4vw 1vw 2.5vw;
    text-align: center;
    font-weight: bold;
    opacity: 0;
}

main .content .scbool_flow .name.show,
main .content .scbool_flow .lerningprogram.show {
    animation: flowitem 0.5s forwards;
}

main .content .scbool_flow .icons {
    text-align: center;
}

main .content .scbool_flow .icons .icon {
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
    display: inline-block;
    position: relative;
    width: 24vw;
    height: 24vw;
    opacity: 0;
}

main .content .scbool_flow .icons .icon.show {
    animation: flowitem 0.5s forwards;
}

main .content .scbool_flow .icons .icon.icon_fieldwork {
    background-image: url(img/icon_fieldwork.png);
}

main .content .scbool_flow .icons .icon.icon_jizengakushu {
    background-image: url(img/icon_jizengakushu.png);
}

main .content .scbool_flow .icons .icon.icon_kataribekouwa {
    background-image: url(img/icon_kataribekouwaN.png);
}

main .content .scbool_flow .icons .icon.icon_seikahappyou {
    background-image: url(img/icon_seikahappyou.png);
}

main .content .scbool_flow .icons .icon.icon_tenjikengaku {
    background-image: url(img/icon_tenjikengaku.png);
}

main .content .scbool_flow .icons .icon.icon_workshop {
    background-image: url(img/icon_workshop.png);
}

main .content .schedule {
    font-size: 4vw;
    margin-top: 4vw;
}

main .content .schedule .midashi {
    padding-left: 0.7em;
    font-weight: bold;
    opacity: 0;
}

main .content .schedule .midashi.show {
    animation: flowitem 0.5s forwards;
}

main .content .schedule .line {
    display: block;
    position: relative;
    margin: 1.2vw 3.8vw;
    background-color: white;
    padding: 0.9vw 0.5vw;
    opacity: 0;
}

main .content .schedule .line.show {
    animation: flowitem 0.5s forwards;
}

main .content .schedule .line:nth-child(2) {
    animation-delay: 0.1s !important;
}

main .content .schedule .line:nth-child(3) {
    animation-delay: 0.2s !important;
}

main .content .schedule .line:nth-child(4) {
    animation-delay: 0.3s !important;
}

main .content .schedule .line:nth-child(5) {
    animation-delay: 0.4s !important;
}

main .content .schedule .line:nth-child(6) {
    animation-delay: 0.5s !important;
}

main .content .schedule .line:nth-child(7) {
    animation-delay: 0.6s !important;
}

main .content .schedule .line:nth-child(8) {
    animation-delay: 0.7s !important;
}

main .content .schedule .line:nth-child(9) {
    animation-delay: 0.8s !important;
}

main .content .schedule .line .time {
    display: inline-block;
    position: relative;
    padding-left: 0.9vw;
    width: 12.7vw;
    border-right: 1px solid #020604;
}

main .content .schedule .line .text {
    display: inline-block;
    position: relative;
    padding-left: 3vw;
}

main .content .interview {
    position: relative;
    margin-bottom: 5vw;
    padding: 0 5vw;
    font-size: 4vw;
}

main .content .interview h2 {
    font-size: 0.8rem;
    opacity: 1;
    margin: 2em 0 0.5rem;
    text-shadow: 2px 2px 2px #EEEA5B;
}

main .content .interview.kiji_1 {
}

main .content .interview.kiji_1 .text {
    display: block;
    position: relative;
    max-height: 52vw;
    overflow: hidden;
    margin-bottom: 5vw;
    /*transition-duration: 0.5s;*/
    transition: max-height 0.5s;
}

main .content .interview.kiji_1 .text:after {
    content: " ";
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 35vw;
    background-image: linear-gradient(transparent, #ffffff);
    transition-duration: 0.5s;
}

main .content .interview.view .text:after {
    height: 0 !important;
}

main .content .interview.view .text {
    max-height: 1000vw !important;
}

main .content .interview#eizou_1 {
    font-size: 3.5vw;
    text-align: center;
}

main .content .interview .sliderArea {
    padding: 0;
}

main .content .interview .larnimage {
    display: block;
    position: relative;
    width: 85vw;
    height: 48.5vw;
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: center;
    margin: 0 auto;
}

main .content .interview iframe {
    width: 85vw;
    height: 48vw;
    margin: 5vw 0;
}

main .content .interview .text {

}

main .content .interview .continuebutton {
    display: block;
    border: 1px solid #020604;
    border-radius: 2em;
    margin: 0 auto;
    padding: 1em;
    width: 65vw;
    text-align: center;
    font-weight: bold;
}

main .content .interview .continuebutton:after {
    content: " ";
    display: inline-block;
    position: relative;
    border-bottom: 2px solid #020604;
    border-right: 2px solid #020604;
    transform: rotate(45deg);
    margin-left: 2vw;
    height: 3.5vw;
    width: 3.5vw;
    top: -0.5vw;
}

main .content .interview.view .continuebutton {
    display: none;
}

.slidein {
    opacity: 1;
    transform: translate(0, 0);
    transition: all 0.5s;

    &.slidein-left {
        transform: translate(-100%, 0);
    }

    &.slidein-right {
        transform: translate(100%, 0);
    }

    &.slidein-up {
        transform: translate(0, -100%);
    }

    &.slidein-bottom {
        transform: translate(0, 10rem);
    }

    &.scrollin {
        transform: translate(0, 0) !important;
        opacity: 1 !important;
    }
}

@keyframes scaleFadeIn {
    0% {
        transform: translate(0, -10vw) scale(5);
        opacity: 0;
        border-radius: 100vw;
    }
    50% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
        border-radius: 0;
    }
    85% {
        transform: translate(0, 0) scale(1.5);
        opacity: 1;
    }
    50% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
    }
}

@media screen and (max-width: 767px) {
    0% {
        transform: translate(20vw, -10vw) scale(5);
        opacity: 0;
        border-radius: 100vw;
    }

    50% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
        border-radius: 0;
    }

    85% {
        transform: translate(0, 0) scale(1.5);
        opacity: 1;
    }

    50% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
    }
}

@keyframes flowitem {
    0% {
        transform: translate(0, 250px) scale(0.5);
        opacity: 0;
        border-radius: 100vw;
    }
    20% {
        transform: translate(0, 10px) scale(1.2);
        opacity: 0.5;
        border-radius: 1vw;
    }
    100% {
        transform: translate(0, 0) scale(1);
        opacity: 1;
        border-radius: 0;
        transition-duration: 0.3s;
    }
}

@media screen and (min-width: 961px) {
    /* ************************************************************ */
    /* 共通 */
    /* ************************************************************ */
    /* 	.header-menu { */
    /* 		display: block !important; */
    /* 	} */
    html, body {
        font-size: 1vw;
    }

    .pc {
        display: initial;
    }

    .sp {
        display: none;
    }

    #wrapper {
        max-width: 1280px;
        margin: 0 auto;
    }

    #page_top {
        width: 6rem;
        height: 6rem;
        right: 1rem;
        bottom: 2rem;
    }

    #page_top:before,
    #page_top:after {
        top: 77%;
        height: 2rem;
        width: 2rem;
    }

    #page_top:after {
        top: 95%;;
    }

    /*#bg_dev {*/
    /*    background-image: url('img/LP_kizukuPC.png');*/
    /*    max-width: 100%;*/
    /*}*/
    header {
        height: 60rem;
        /*height: 80.6rem;*/
    }

    header #fukidashi_1 {
        top: 8.9rem;
        left: 13.4rem;
        height: 12.2rem;
        width: 16.4rem;
    }

    header #fukidashi_2 {
        top: 7.1rem;
        left: 64.5rem;
        height: 15.5rem;
        width: 15.2rem;
    }

    header #fukidashi_3 {
        top: 28.4rem;
        left: 12.9rem;
        height: 19rem;
        width: 18.3rem;
    }

    header #fukidashi_4 {
        top: 28.4rem;
        left: 65.7rem;
        height: 23.7rem;
        width: 15.3rem;
    }

    header h1 #title_a {
        top: 9.2rem;
        left: 39.8rem;
        height: 14.3rem;
        width: 15.2rem;
    }

    header h1 #title_exclamation {
        top: 8.6rem;
        left: 52.8rem;
        height: 19.2rem;
        width: 7.6rem;
    }

    header #title_kizuku_1k {
        top: 23.9rem;
        left: 31.8rem;
        height: 7.6rem;
        width: 7.5rem;
    }

    header #title_kizuku_2i {
        top: 23.9rem;
        left: 36.6rem;
        height: 7.6rem;
        width: 7.5rem;
    }

    header #title_kizuku_3z {
        top: 23.9rem;
        left: 41.4rem;
        height: 7.6rem;
        width: 7.5rem;
    }

    header #title_kizuku_4u {
        top: 23.9rem;
        left: 46.4rem;
        height: 46.4rem;
        width: 7.5rem;
    }

    header #title_kizuku_5k {
        top: 23.9rem;
        left: 51.4rem;
        height: 7.6rem;
        width: 7.5rem;
    }

    header #title_kizuku_6u {
        top: 23.9rem;
        left: 56.3rem;
        height: 7.6rem;
        width: 7.5rem;
    }

    header .message {
        top: 10rem;
        width: 24.5rem;
        font-size: 1.6rem;
        padding-top: 27.3rem;
        text-align: center;
    }

    footer {
        margin: 10rem 0 2rem;
        padding: 10rem 0 2rem;
    }

    footer .footerlink {
        width: 75rem;
    }

    footer .footerlink p {
        display: inline-block;
        vertical-align: top;
        margin: 0 0 0 1rem;
        width: calc(100% - 42rem);
        padding: 0;
        font-size: 16px;
    }

    footer .footerlink a {
        width: 40rem;
        margin-bottom: 5rem;
        margin-bottom: 0;
        display: inline-block;
        vertical-align: top;
    }

    footer .footerlink a img {
        max-width: 80%;
        margin-left: 10%;
    }


    main #news {
        margin-bottom: 10rem;
    }

    main #why {
        width: calc(90% - 2em);
        margin: 0 auto 5em;
        background-color: #F7F7F7;
        padding: 1em;
        font-size: 16px;
    }

    main #why_description,
    main #why_image {
        display: inline-block;
        position: relative;
        width: 49%;
        vertical-align: middle;
    }

    main #why_image {
        text-align: center;
    }

    main #why_image #why_image_photo {
        width: 80%;
        height: 300px;
    }

    /*main #why {*/
    /*    width: 90vw;*/
    /*    margin: 0 auto;*/
    /*    background-color: #5e5e5e;*/
    /*}*/
    #map_section_sp {
        /*display: block;*/
        /*display: flex;*/
        flex-wrap: nowrap;
        overflow: hidden;
        /*-webkit-overflow-scrolling: touch; !* iOSでの滑らかなスクロール用 *!*/
    }

    #swipeicon {
        display: none;
    }

    #map_section {
        height: 50rem;
        width: 100%;
    }

    #mapimage {
        width: 100%;
        height: 100%;
    }

    .map_pin .point {
        border: 0.8rem solid #72B5C8;
        border-radius: 0.8rem;
    }

    .map_pin .point_center {
        border: 0.4rem solid #fff;
        border-radius: 0.4rem;
        top: 0.4rem;
        left: 0.4rem;
    }

    .map_pin .line1 {
        border-bottom: 0.2rem solid #333;
        margin: -0.2rem 0 0 -2.2rem;
        width: 4rem;
    }

    .map_pin .name {
        margin: -4.1rem 0 0 -21.3rem;
        font-size: 1.8rem;
        line-height: 1.4em;
        border-bottom: 0.2rem solid #333;
    }

    .map_pin.example#pin_example_movie,
    .map_pin.example#pin_example_kiji {
        top: 37rem;
        left: 43rem;
    }

    .map_pin.example#pin_example_kiji {
        top: 39.5rem;
    }

    .map_pin#pin_nakamura1jhs .name,
    .map_pin#pin_azumajhs .name,
    .map_pin#pin_fukushima3rdjhs .name,
    .map_pin#pin_inawashirojhs .name,
    .map_pin#pin_ousejhs .name {
        background-color: rgba(255, 255, 255, 0.8);
    }

    .map_pin#pin_denshoukan .name {
        font-size: 1.2rem;
        margin: -1.7rem 0 0 -7.5rem;
        width: 7em;
    }

    .map_pin#pin_denshoukan {
        top: 23rem;
        left: 74.5rem;
    }

    .map_pin#pin_nakamura1jhs {
        top: 9rem;
        left: 71.5rem;
    }

    .map_pin#pin_azumajhs {
        top: 10rem;
        left: 56rem;
    }

    .map_pin#pin_azumajhs .line1 {
        margin-top: 1.7rem;
    }

    .map_pin#pin_azumajhs .name {
        margin-top: -0.5rem;
        margin-left: -17.7rem;
    }

    .map_pin#pin_fukushima3rdjhs {
        top: 9rem;
        left: 59rem;
    }

    .map_pin#pin_fukushima3rdjhs .line1 {
        margin-top: 2.6rem;
        margin-left: 0;
        width: 5.7rem;
    }

    .map_pin#pin_fukushima3rdjhs .name {
        width: 11.5em;
        margin-top: 2.4rem;
        margin-left: 4.4rem;
    }

    .map_pin#pin_ousejhs {
        top: 24.5rem;
        left: 54.5rem;
    }

    .map_pin#pin_inawashirojhs {
        top: 18.5rem;
        left: 49rem;
    }

    .map_pin#pin_ousejhs .line1 {
        margin-top: 1.6rem;
    }

    .map_pin#pin_ousejhs .name {
        margin-top: 0.5rem;
        margin-left: -17.8rem;
    }

    main .kousinjouhou {
        top: 1.8rem;
        left: -1rem;
        height: calc(14.5rem - 1.1em);
        width: calc(38.8rem - 1.8em);
        font-size: 1.8rem;
        padding-top: 0.7em;
        line-height: 2.1em;
        margin: 0 auto;
        padding-left: 1em;
    }

    main .title#kijihen, main .title#eizouhen {
        height: 6.6rem;
        width: 15rem;
        margin: 2.5rem auto;
    }

    main .content_sheet {
        font-size: 0;
        display: block;
        padding: 0.5rem 0 1.6rem;
        width: 82%;
        margin: 3% auto;
        border-right: 2px solid #E1E1E0;
        border-bottom: 2px solid #E1E1E0;
    }

    main .content .title,
    main .content .title#inochino,
    main .content .title#jibungoto {
        height: 2.5rem;
        left: -2.1rem;
        margin-top: 4.3rem;
        margin-bottom: 5.2rem;
        background-position-x: 18.5rem;
    }

    main .content .title:before,
    main .content .title#inochino:before,
    main .content .title#jibungoto:before {
        position: relative;
        top: -2rem;
        left: 5.3rem;
        display: inline-block;
        height: 6rem;
        width: 11rem;
    }

    main .content .title#inochino:before,
    main .content .title#jibungoto:before,
    main .content .title#koudouhenoippo:before,
    main .content .title#manabi:before,
    main .content .title#gakushu:before {
        top: 2rem;
        left: -1rem;
    }

    main .content .title#inochino,
    main .content .title#koudouhenoippo,
    main .content .title#jibungoto,
    main .content .title#manabi,
    main .content .title#gakushu{
        font-size: 2.5rem;
        top: -5rem;
        padding-left: 18rem;
    }

    main .content .title#koudouhenoippo:before {

    }

    main .content .scbool_flow {
        display: inline-block;
        position: relative;
        width: 25.2rem;
        margin: 0 3.4rem 0 5.4rem;
        font-size: 1.5rem;
        /* font-size: 9pt; */
        padding-bottom: 0.5rem;
        vertical-align: top;
    }

    main .content .scbool_flow:after {
        content: " ";
        display: block;
        position: absolute;
        width: 1px;
        height: 42rem;
        /*height: -webkit-fill-available;*/
        top: 0;
        left: 28.8rem;
        background-color: #656564;
    }

    main .content .scbool_flow .name {
        padding: 1.4rem 0 1.2rem 1.3rem;
    }

    main .content .scbool_flow .lerningprogram {
        padding: 0.8rem 0rem;
    }

    main .content .scbool_flow .icons .icon {
        width: 7rem;
        height: 7rem;
    }

    main .content .schedule {
        font-size: 1.2rem;
        margin-top: 1.6rem;
    }

    main .content .schedule .line {
        padding: 0.2rem 0;
        margin: 0.5rem 1rem;
    }

    main .content .schedule .line .time {
        width: 3.7rem;
        padding-left: 0.3rem;
    }

    main .content .schedule .line .text {
        padding-left: 0.7rem;
    }

    main .content .interview {
        display: inline-block;
        width: 38rem;
        padding: 0 3.8rem;
        font-size: 1.2rem;
        margin-bottom: 1.8rem;
    }

    main .content .interview h2 {
        font-size: 1.5rem;
    }

    main .content .interview .larnimage {
        width: 100%;
        height: 21.6rem;
    }

    main .content .interview.view .text {
        margin-bottom: 5rem;
    }

    main .content .interview.kiji_1 .text {
        max-height: 15rem;
        margin-bottom: 1.2rem;
    }

    main .content .interview.kiji_1 .text:after {
        height: 7rem;
    }

    main .content .interview .continuebutton {
        width: 16rem;
        padding: 0.9em;
    }

    main .content .interview .continuebutton:after {
        height: 0.7rem;
        width: 0.7rem;
        top: -0.2rem;
        margin-left: 0.5rem;
    }

    main .content .interview#eizou_1 {
        font-size: 1.5rem;
    }

    main .content .interview iframe {
        width: 100%;
        height: 21.1rem;
        margin: 2.5rem 0;
    }
}

@media screen and (min-width: 1280px) {
    html, body {
        font-size: 13px;
    }
}