@charset "UTF-8";
/*************************************** 矢印
*****************************************/
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)
*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

ol, ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

table { border-collapse: collapse; border-spacing: 0; }

button, input, select, textarea { outline: none; font-size: 1em; }

button { margin: 0; padding: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; outline: none; border: none; cursor: pointer; }

a { color: inherit; text-decoration: none; }

a.rev { text-decoration: underline; }

a.rev:hover { text-decoration: none; }

*, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; }

fieldset { border: 0; margin: 0; padding: 0; }

/*************************************** 矢印
*****************************************/
/****************************************
common.scss
/****************************************
 common

*****************************************/
.clearfix::after { content: ""; display: block; clear: both; }

.float-l { float: left; }

.float-r { float: right; }

.postion-r { position: relative; }

.postion-a { position: absolute; }

@media print, screen and (min-width: 1030px) { .ma70 { margin-bottom: 70px; }
  .ma60 { margin-bottom: 60px; }
  .ma55 { margin-bottom: 55px; }
  .ma50 { margin-bottom: 50px; }
  .ma45 { margin-bottom: 45px; }
  .ma40 { margin-bottom: 40px; }
  .ma35 { margin-bottom: 35px; }
  .ma35 { margin-bottom: 35px; }
  .ma30 { margin-bottom: 30px; }
  .ma25 { margin-bottom: 25px; }
  .ma20 { margin-bottom: 20px; }
  .ma15 { margin-bottom: 15px; }
  .ma10 { margin-bottom: 10px; } }
@media screen and (max-width: 1029px) { .sp-ma70 { margin-bottom: 70px; }
  .sp-ma60 { margin-bottom: 60px; }
  .sp-ma55 { margin-bottom: 55px; }
  .sp-ma50 { margin-bottom: 50px; }
  .sp-ma45 { margin-bottom: 45px; }
  .sp-ma40 { margin-bottom: 40px; }
  .sp-ma35 { margin-bottom: 35px; }
  .sp-ma35 { margin-bottom: 35px; }
  .sp-ma30 { margin-bottom: 30px; }
  .sp-ma25 { margin-bottom: 25px; }
  .sp-ma20 { margin-bottom: 20px; }
  .sp-ma15 { margin-bottom: 15px; }
  .sp-ma10 { margin-bottom: 10px; } }
.pc-block { display: block; }
@media screen and (max-width: 1029px) { .pc-block { display: none; } }

.sp-block { display: none; }
@media screen and (max-width: 1029px) { .sp-block { display: block; } }

/****************************************
 flex

*****************************************/
@media print, screen and (min-width: 1030px) { .flex { display: flex; flex-wrap: wrap; align-items: flex-start; } }
@media screen and (max-width: 1029px) { .sp-flex { display: flex; flex-wrap: wrap; align-items: flex-start; } }
@media print, screen and (min-width: 1030px) { .flex-ce { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; } }
@media screen and (max-width: 1029px) { .sp-flex-ce { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; } }
@media print, screen and (min-width: 1030px) { .flex-txt-ce { display: flex; align-items: center; } }
@media screen and (max-width: 1029px) { .sp-flex-txt-ce { display: flex; align-items: center; } }
@media print, screen and (min-width: 1030px) { .flex-mce { display: flex; justify-content: center; align-items: center; } }
@media screen and (max-width: 1029px) { .sp-flex-mce { display: flex; justify-content: center; align-items: center; } }
@media print, screen and (min-width: 1030px) { .flex-u { display: flex; align-items: flex-end; } }
@media screen and (max-width: 1029px) { .sp-flex-u { display: flex; align-items: flex-end; } }
@media print, screen and (min-width: 1030px) { .flex-t { flex-direction: column; } }
@media screen and (max-width: 1029px) { .sp-flex-t { flex-direction: column; } }
@media print, screen and (min-width: 1030px) { .flex-re { flex-direction: row-reverse; } }
@media screen and (max-width: 1029px) { .flex-re { flex-direction: row-reverse; } }
@media print, screen and (min-width: 1030px) { .flex-ue { align-items: flex-start; } }
@media screen and (max-width: 1029px) { .sp-flex-ue { align-items: flex-start; } }
@media print, screen and (min-width: 1030px) { .flex-o { order: -1; } }
@media screen and (max-width: 1029px) { .sp-flex-o { order: -1; } }
@media print, screen and (min-width: 1030px) { .flex-rt { display: flex; flex-direction: column-reverse; } }
@media screen and (max-width: 1029px) { .sp-flex-rt { display: flex; flex-direction: column-reverse; } }
@media print, screen and (min-width: 1030px) { .flex-r { display: flex; justify-content: flex-end; } }
@media screen and (max-width: 1029px) { .sp-flex-r { display: flex; justify-content: flex-end; } }
/****************************************
 Typography

*****************************************/
html { font-size: 62.5%; }

body { font-size: 1.6rem; line-height: 1.8; color: #333; font-family: source-han-sans-japanese, "游ゴシック", YuGothic, "Hiragino Kaku Gothic ProN", "Hiragino Kaku Gothic Pro", sans-serif; overflow-x: hidden; }

* { font-family: inherit; font-size: inherit; line-height: inherit; }

a, a:visited { color: inherit; }

address { font-style: normal; }

.bold { font-weight: 700; }

.text-center { text-align: center; }

@media screen and (max-width: 1029px) { .sp-text-left { text-align: left; } }
.text-right { text-align: right; }

/****************************************
 button

*****************************************/
/* Remove text-shadow in selection highlight: h5bp.com/i These selection rule sets have to be separate. Customize the background color to match your design. */
::-moz-selection { background: #b3d4fc; text-shadow: none; }

::selection { background: #b3d4fc; text-shadow: none; }

/* Remove the gap between images, videos, audio and canvas and the bottom of their containers: h5bp.com/i/440 */
audio, canvas, img, video { vertical-align: middle; }

/* Allow only vertical resizing of textareas. */
textarea { resize: vertical; vertical-align: top; }

label, select, input[type=submit] { cursor: pointer; }

/****************************************
 link

*****************************************/
a:hover, a:focus, a:active { transition: all 0.8s ease 0s; }

img { max-width: 100%; max-height: 100%; width: auto; height: auto; vertical-align: top; font-size: 0; line-height: 0; }

/****************************************
 カラム

*****************************************/
@media print, screen and (min-width: 1030px) { .col2-list > * { width: 48%; } }
@media screen and (max-width: 1029px) { .sp-col2-list > * { width: 48%; } }
@media print, screen and (min-width: 1030px) { .col3-list > * { width: 32%; } }
@media screen and (max-width: 1029px) { .sp-col3-list > * { width: 32%; } }
@media print, screen and (min-width: 1030px) { .col4-list > * { width: 24%; } }
@media screen and (max-width: 1029px) { .sp-col4-list > * { width: 24%; } }
/****************************************
 container

*****************************************/
.wide-contents { max-width: 1500px; width: 90%; margin-left: auto; margin-right: auto; }

@media print, screen and (min-width: 1030px) { .tablet90 { margin-left: 5%; margin-right: 5%; width: 90%; } }
@media screen and (min-width: 1030px) { .tablet90 { margin-left: auto; margin-right: auto; width: 100%; } }
@media screen and (max-width: 1029px) { .tablet90 { width: 90%; margin-left: 5%; margin-right: 5%; } }

.center { margin-left: auto; margin-right: auto; }
@media print, screen and (min-width: 1030px) { .center { max-width: 1180px; padding-left: 40px; padding-right: 40px; } }
@media screen and (max-width: 1029px) { .center { width: 90%; } }

.w90 { width: 90%; margin-left: auto; margin-right: auto; }

.main-contents .left-cont { margin-left: auto; margin-right: auto; }
@media print, screen and (min-width: 1030px) { .main-contents .left-cont { max-width: 930px; width: calc(100% - 220px - 40px); } }
@media print, screen and (min-width: 1030px) { .main-contents .left-cont .inner-cont { margin-left: auto; margin-right: auto; padding-left: 40px; padding-right: 40px; } }
@media screen and (max-width: 1029px) { .main-contents .left-cont .inner-cont { padding-left: 5%; padding-right: 5%; } }
@media print, screen and (min-width: 1030px) { .main-contents .right-cont { width: 220px; margin-right: 40px; } }
@media screen and (max-width: 1029px) { .main-contents .right-cont { margin-top: 60px; margin-bottom: 60px; padding-left: 5%; padding-right: 5%; } }

.sp-right_nav, .right-cont { line-height: 130%; }
.sp-right_nav .border-title, .right-cont .border-title { border: solid 1px #707070; text-align: center; font-weight: 700; background: white; }
@media print, screen and (min-width: 1030px) { .sp-right_nav .border-title, .right-cont .border-title { margin-top: 30px; margin-bottom: 20px; padding: 10px 5px; } }
@media screen and (max-width: 1029px) { .sp-right_nav .border-title, .right-cont .border-title { padding: 5px 5px; margin-top: 20px; margin-bottom: 10px; display: inline-block; } }
.sp-right_nav a, .right-cont a { font-weight: bold; display: block; }
@media print, screen and (min-width: 1030px) { .sp-right_nav a, .right-cont a { transition: ease .3s; }
  .sp-right_nav a:hover, .right-cont a:hover { background: #E1E8F5; color: inherit; } }
.sp-right_nav a.se, .right-cont a.se { background: #CAD4E6; }
@media print, screen and (min-width: 1030px) { .sp-right_nav a, .right-cont a { padding: 10px 0; } }
@media screen and (max-width: 1029px) { .sp-right_nav a, .right-cont a { padding: 8px 0; } }
.sp-right_nav .child, .right-cont .child { margin-bottom: 10px; }
.sp-right_nav .child a, .right-cont .child a { font-weight: normal; font-size: 1.4rem; padding: 5px 10px; }

.sp-right_nav { display: none; }
@media screen and (max-width: 1029px) { .sp-right_nav { background: #E1E8F5; padding: 15px 5% 20px; }
  .sp-right_nav .child { display: none; } }

.contents_nav_title { background: #7C95C2; color: white; padding: 15px; }

/****************************************
 parts

*****************************************/
.googlemap, .video { position: relative; width: 100%; padding-top: 56.25%; }
.googlemap iframe, .video iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

.googlemap { padding-top: 100%; }

@media screen and (max-width: 1029px) { .table_area { width: 100%; overflow: scroll; }
  .table_area table { min-width: 900px; } }
a.newtab::after, .link-icon::after { content: ""; display: inline-block; width: 20px; height: 20px; margin-left: 10px; background: url(../img/common/newtab.svg) no-repeat center; background-size: contain; }

ul.dot li, ol.dot li { position: relative; padding-left: 20px; }
ul.dot li::before, ol.dot li::before { content: ""; display: block; position: absolute; left: 0; top: 8px; width: 12px; height: 12px; border-radius: 50%; background: #7C95C2; }

.search_area input[type=submit] { background: url(../img/common/search_ico.svg) no-repeat center #7C95C2; background-size: auto 70%; border: none; padding: 2px 10px; color: transparent; }

/****************************************

アコーディオン

*****************************************/
.accordion > dt { background: black; color: white; position: relative; margin-bottom: 10px; }
.accordion > dt div { font-weight: bold; padding: 20px 40px 20px 20px; display: inline-block; line-height: 130%; }
.accordion > dt div::before, .accordion > dt div::after { content: ""; display: block; position: absolute; width: 16px; height: 2px; background: white; top: 50%; transform-origin: center; }
@media print, screen and (min-width: 1030px) { .accordion > dt div::before, .accordion > dt div::after { right: 20px; } }
@media screen and (max-width: 1029px) { .accordion > dt div::before, .accordion > dt div::after { right: 5%; } }
.accordion > dt div::after { transform: rotate(90deg); }
.accordion > dt.open div::after { display: none; }
.accordion > dd { display: none; position: relative; }

/****************************************

ナビページ

*****************************************/
.border-title span { border: solid 1px #707070; display: inline-block; padding: 2px 10px; margin-bottom: 25px; }

.contents_nav_page .flex-ce > * { margin-bottom: 70px; }
@media screen and (max-width: 1029px) { .contents_nav_page .border-title { text-align: center; } }
.contents_nav_page ul { margin-top: 20px; }
.contents_nav_page li a { font-weight: 700; padding: 10px 5px; display: block; line-height: 130%; position: relative; }
@media print, screen and (min-width: 1030px) { .contents_nav_page li a { transition: ease .3s; }
  .contents_nav_page li a:hover { background: #E1E8F5; color: inherit; } }
.contents_nav_page li a::after { content: ""; position: absolute; margin-top: -2.5px; display: block; background-size: contain !important; width: 16px; height: 5px; top: 50%; right: 20px; background: url(../img/common/arrow_b.svg) no-repeat center; }

/****************************************

loading

*****************************************/
#load { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: white; z-index: 999; }

/* news */
.news .ico { background: #eee; color: white; }
.news .ico.news { background: #5774AA; }
.news .ico.students { background: #5EA3D5; }
.news .ico.urgent { background: #CC7171; }
.news .ico.exam { background: #D987BA; }
.news .ico.career { background: #9B7BB7; }
.news .ico.pickup { background: #B1A300; }
.news .ico.visitor { background: #7AAC86; }
.news .ico.parents { background: #C1A988; }
.news .ico.graduate { background: #9F7A60; }
.news .ico.recruit { background: #959595; }
.news .ico.course_graduate { background: #2E416C; }

/*************************************** 矢印
*****************************************/
/* header.scss

***************************************
 header

*****************************************/
header { display: flex; align-items: center; justify-content: space-between; border-bottom: solid 1px #777; position: fixed; width: 100%; top: 0; background: white; z-index: 99; }
@media screen and (max-width: 1029px) { header { padding: 0 5%; height: 90px; } }
header .head_logo { transition: ease .3s; position: relative; }
header .head_logo .gakuen100 { position: absolute; width: 50px; height: 100%; right: 30px; top: 0; }
@media print, screen and (min-width: 1030px) { header .head_logo { padding: 0 30px; width: 320px; } }
@media screen and (max-width: 1029px) { header .head_logo { padding: 0; height: 34px; width: 175px; }
  header .head_logo .gakuen100 { width: 21%; right: 0; } }
@media print, screen and (min-width: 1030px) { header .sp_nav ol, header nav ol { display: flex; } }
@media screen and (max-width: 1029px) { header .sp_nav, header nav { width: 100%; } }
header .sp_nav .sns, header .sp_nav .ico_nav, header nav .sns, header nav .ico_nav { display: flex; justify-content: flex-end; }
header .sp_nav a, header nav a { display: block; line-height: 130%; }
header .sp_nav img, header nav img { display: block; margin: auto; }
@media print, screen and (min-width: 1030px) { header .sp_nav img, header nav img { width: 22.5px; } }
@media screen and (max-width: 1029px) { header .sp_nav img, header nav img { width: 25px; height: 25px; } }
header .newtab::after { background-image: url(../img/common/newtab_bk.svg); width: 12px; height: 12px; margin-left: 5px; }
header .sp_nav, header .sub_nav { align-items: center; justify-content: flex-end; }
@media print, screen and (min-width: 1030px) { header .sp_nav, header .sub_nav { display: flex; } }
header .sp_nav ol, header .sub_nav ol { background: #E1E8F5; }
@media print, screen and (min-width: 1030px) { header .sp_nav ol, header .sub_nav ol { padding-left: 10px; margin: 0 0 0 auto; } }
@media screen and (max-width: 1029px) { header .sp_nav ol, header .sub_nav ol { padding: 25px 5% 80px; display: flex; flex-wrap: wrap; }
  header .sp_nav ol li, header .sub_nav ol li { width: 33.3%; } }
header .sp_nav a, header .sub_nav a { font-weight: 700; }
@media print, screen and (min-width: 1030px) { header .sp_nav a, header .sub_nav a { padding: 20px 8px; font-size: 1.2rem; } }
@media screen and (max-width: 1029px) { header .sp_nav a, header .sub_nav a { padding: 10px 0; } }
header .sp_nav .sns, header .sub_nav .sns { padding: 0 5px; display: flex; align-items: center; }
@media print, screen and (min-width: 1030px) { header .sp_nav .sns, header .sub_nav .sns { border-left: solid 1px white; border-right: solid 1px white; }
  header .sp_nav .sns a, header .sub_nav .sns a { padding: 10px 6px; }
  header .sp_nav .sns img, header .sub_nav .sns img { width: 18px; } }
@media screen and (max-width: 1029px) { header .sp_nav .sns, header .sub_nav .sns { width: 100%; border-top: solid 1px white; border-bottom: solid 1px white; margin-top: 15px; margin-bottom: 15px; justify-content: center; padding: 20px 0; }
  header .sp_nav .sns a, header .sub_nav .sns a { padding: 10px 0; width: 50px; } }
header .sp_nav .lib, header .sp_nav .en, header .sp_nav .search, header .sub_nav .lib, header .sub_nav .en, header .sub_nav .search { display: flex; align-items: center; }
@media screen and (max-width: 1029px) { header .sp_nav .lib, header .sp_nav .en, header .sp_nav .search, header .sub_nav .lib, header .sub_nav .en, header .sub_nav .search { margin: 0 auto; width: auto; } }
header .sp_nav .lib a, header .sp_nav .en a, header .sp_nav .search a, header .sub_nav .lib a, header .sub_nav .en a, header .sub_nav .search a { padding: 0; }
@media print, screen and (min-width: 1030px) { header .sp_nav .lib img, header .sp_nav .en img, header .sp_nav .search img, header .sub_nav .lib img, header .sub_nav .en img, header .sub_nav .search img { width: 48px; } }
@media screen and (max-width: 1029px) { header .sp_nav .lib img, header .sp_nav .en img, header .sp_nav .search img, header .sub_nav .lib img, header .sub_nav .en img, header .sub_nav .search img { height: 45px; width: auto; } }
@media print, screen and (min-width: 1030px) { header .sp_nav .en, header .sub_nav .en { padding-right: 10px; }
  header .sp_nav .search, header .sub_nav .search { padding-left: 10px; }
  header .sp_nav .lib img, header .sub_nav .lib img { width: 50px; } }
@media print, screen and (min-width: 1030px) { header .sub_nav a { padding: 20px 8px; } }
@media screen and (max-width: 1029px) { header .sub_nav .donation { width: 100%; } }
@media print, screen and (min-width: 1030px) { header .main_nav { display: flex; justify-content: flex-end; }
  header .main_nav ol { margin-right: 15px; }
  header .main_nav li:hover > .child { display: flex; } }
@media print, screen and (min-width: 1030px) and (min-width: 1030px) { header .main_nav li:not(.ico_nav) { transition: ease .3s; }
  header .main_nav li:not(.ico_nav):hover { background: #E1E8F5; color: inherit; } }

header .main_nav a { font-size: 1.5rem; font-weight: 700; position: relative; }
@media print, screen and (min-width: 1030px) { header .main_nav a { height: 90px; padding: 15px; display: flex; align-content: center; align-items: center; }
  header .main_nav a:hover::before, header .main_nav a.se::before { content: ""; display: block; position: absolute; width: 100%; height: 8px; bottom: 0; left: 0; background: #2F569F; } }
@media screen and (max-width: 1029px) { header .main_nav a { padding: 15px 0; width: 60%; } }
@media print, screen and (min-width: 1030px) { header .main_nav a { transition: ease .3s; }
  header .main_nav a:hover { background: #E1E8F5; color: inherit; } }
@media print, screen and (min-width: 1030px) { header .main_nav li { position: relative; }
  header .main_nav li.about-parent { position: static; }
  header .main_nav li.about-parent .child { left: 50%; margin-left: -500px; }
  header .main_nav li.about-parent .child div:nth-child(3) { margin-bottom: 40px; } }
@media screen and (max-width: 1029px) { header .main_nav li .child a { width: 100%; } }
header .main_nav .child { display: none; background: white; }
@media print, screen and (min-width: 1030px) { header .main_nav .child { border: solid 1px #777; position: absolute; z-index: 99; width: 1000px; padding: 40px 30px; left: 0; margin-left: 0; }
  header .main_nav .child.campuslife-child { width: 500px; }
  header .main_nav .child.course-child { width: 710px; margin-left: -200px; }
  header .main_nav .child.career-child { width: 535px; left: -110%; } }
header .main_nav .child div { margin-bottom: 20px; }
@media screen and (max-width: 1029px) { header .main_nav .child { background: #eeeeee; padding: 5%; }
  header .main_nav .child .sp-ma0 { margin-bottom: 0; } }
header .main_nav .child b { display: inline-block; font-weight: 700; font-size: 1.4rem; padding: 2px 10px; margin-bottom: 5px; border: solid 1px #707070; background: white; }
header .main_nav .child a { height: auto; }
header .main_nav .child a:hover::before { display: none; }
@media print, screen and (min-width: 1030px) { header .main_nav .child a { padding: 8px 10px; } }
@media screen and (max-width: 1029px) { header .main_nav .child a { padding: 8px 0; border: none; margin: 0; } }
@media print, screen and (min-width: 1030px) { header .main_nav .child.col4-list > * { width: 25%; } }
header .main_nav .ico_nav a { padding: 0; font-size: 1rem; flex-wrap: wrap; }
@media print, screen and (min-width: 1030px) { header .main_nav .ico_nav a { width: 50px; } }
header .main_nav .ico_nav p { width: 100%; margin-top: 5px; text-align: center; }
@media screen and (max-width: 1029px) { header .main_nav .ico_nav { border-top: solid 1px #bbbbbb; justify-content: center; margin: 0 5%; padding-top: 25px; padding-bottom: 25px; }
  header .main_nav .ico_nav a { border: none; margin: 0 5%; } }
header .head_nav_area .head_logo, header .sp_nav { display: none; }
@media screen and (max-width: 1029px) { header .main_nav, header .sub_nav { display: block; } }

header.fixed .head_logo { width: 280px; }

@media screen and (max-width: 1029px) { header { height: 70px; z-index: 99; }
  header .sp_nav { display: flex; width: calc(100% - 170px); }
  header .sp_nav a { font-size: 1rem; width: 50px; text-align: center; }
  header .sp_nav p { margin-top: 5px; }
  #sp_nav a { width: 30px; margin-left: 10px; background: no-repeat 10px center; background-size: 25px auto; }
  #sp_nav.open a { background: url(../img/common/close_menu.svg) no-repeat 10px center; background-size: 25px auto; }
  #sp_nav.open img { opacity: 0; }
  #sp_nav.open p { display: none; }
  .head_nav_area { display: none; position: fixed; z-index: 98; width: 100%; height: calc(100% - 70px); overflow: scroll; background: white; left: 0; top: 70px; }
  .head_nav_area .head_nav { display: flex; flex-wrap: nowrap; flex-direction: column-reverse; justify-content: flex-end; }
  .parent { position: relative; border-top: solid 1px #bbbbbb; margin: 0 5%; }
  .parent::before, .parent::after { content: ""; display: block; width: 15px; height: 3px; background: #333333; position: absolute; right: 0; top: 23px; }
  .parent::after { transform: rotate(90deg); }
  .parent.open::after { display: none; }
  .parent.nochild::before, .parent.nochild::after { display: none; }
  .parent.about-parent { border: none; } }
/* footer

***************************************
 footer

*****************************************/
footer { background: #2F569F; padding: 70px 0 30px; font-size: 1.5rem; }
footer > * { color: white; }
footer .foot_logo { width: 200px; margin: 0 auto 70px; }
@media print, screen and (min-width: 1030px) { footer { margin-top: 100px; }
  footer .flex { justify-content: center; }
  footer .flex > * { width: 50%; } }
@media print, screen and (min-width: 1030px) { footer .flex > * { width: 40%; }
  footer .course_flex { display: flex; }
  footer .course_flex > * { width: 45%; } }
footer b { font-size: 1.8rem; font-weight: 700; display: block; margin-bottom: 20px; }
footer ul { border-left: solid 1px white; padding-left: 20px; }
@media print, screen and (min-width: 1030px) { footer ul li { margin-bottom: 10px; } }
footer .foot_sub_nav { margin: 60px auto; border-top: solid 1px white; border-bottom: solid 1px white; padding: 10px; }
footer .foot_sub_nav a { padding: 10px 15px; }
@media screen and (max-width: 1029px) { footer .foot_sub_nav { padding: 20px 0 10px; width: 90%; }
  footer .foot_sub_nav li { margin-bottom: 10px; } }

.copyright { font-size: 1.2rem; text-align: center; }

#totop a { position: fixed; z-index: 98; width: 50px; height: 50px; background-color: #7C95C2; }
@media print, screen and (min-width: 1030px) { #totop a { right: 0; bottom: 40px; } }
@media screen and (max-width: 1029px) { #totop a { right: 0; bottom: 90px; } }
#totop a .ico-box { position: absolute; width: 7.5px; height: 27px; top: 50%; left: 50%; margin-top: -13.5px; margin-left: -3.75; background-image: url("../img/common/totop.svg"); background-size: contain; }

@media screen and (max-width: 1029px) { .sp_foot_btn_area { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 999; }
  .sp_foot_btn { margin: auto; position: relative; width: 90%; max-width: 500px; }
  .sp_foot_btn a { display: block; width: 33.3%; position: absolute; height: 100%; top: 0; z-index: 2; }
  .sp_foot_btn a.sns { left: 0; }
  .sp_foot_btn a.nyushi { left: 33.3%; }
  .sp_foot_btn a.oc { left: 66.6%; } }
@media print { header { position: absolute; top: 0; } }
/*!
 * animate.css -https://daneden.github.io/animate.css/
 * Version - 3.7.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2019 Daniel Eden
 */
@-webkit-keyframes bounce { from,
  20%,
  53%,
  80%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  40%,
  43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); }
  70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); }
  90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } }
@keyframes bounce { from,
  20%,
  53%,
  80%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  40%,
  43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); }
  70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); }
  90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } }
.bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; transform-origin: center bottom; }

@-webkit-keyframes flash { from,
  50%,
  to { opacity: 1; }
  25%,
  75% { opacity: 0; } }
@keyframes flash { from,
  50%,
  to { opacity: 1; }
  25%,
  75% { opacity: 0; } }
.flash { -webkit-animation-name: flash; animation-name: flash; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
@keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
.pulse { -webkit-animation-name: pulse; animation-name: pulse; }

@-webkit-keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); }
  40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); }
  50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); }
  65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); }
  75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
@keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); }
  40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); }
  50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); }
  65% { -webkit-transform: scale3d(0.95, 1.05, 1); transform: scale3d(0.95, 1.05, 1); }
  75% { -webkit-transform: scale3d(1.05, 0.95, 1); transform: scale3d(1.05, 0.95, 1); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
.rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; }

@-webkit-keyframes shake { from,
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  10%,
  30%,
  50%,
  70%,
  90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  20%,
  40%,
  60%,
  80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } }
@keyframes shake { from,
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  10%,
  30%,
  50%,
  70%,
  90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  20%,
  40%,
  60%,
  80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } }
.shake { -webkit-animation-name: shake; animation-name: shake; }

@-webkit-keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); }
  6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); }
  18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); }
  31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); }
  43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); }
  50% { -webkit-transform: translateX(0); transform: translateX(0); } }
@keyframes headShake { 0% { -webkit-transform: translateX(0); transform: translateX(0); }
  6.5% { -webkit-transform: translateX(-6px) rotateY(-9deg); transform: translateX(-6px) rotateY(-9deg); }
  18.5% { -webkit-transform: translateX(5px) rotateY(7deg); transform: translateX(5px) rotateY(7deg); }
  31.5% { -webkit-transform: translateX(-3px) rotateY(-5deg); transform: translateX(-3px) rotateY(-5deg); }
  43.5% { -webkit-transform: translateX(2px) rotateY(3deg); transform: translateX(2px) rotateY(3deg); }
  50% { -webkit-transform: translateX(0); transform: translateX(0); } }
.headShake { -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: headShake; animation-name: headShake; }

@-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); }
  40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); }
  60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); }
  80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); }
  to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } }
@keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); }
  40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); }
  60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); }
  80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); }
  to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } }
.swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; }

@-webkit-keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  10%,
  20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
  30%,
  50%,
  70%,
  90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
  40%,
  60%,
  80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
@keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
  10%,
  20% { -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
  30%,
  50%,
  70%,
  90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
  40%,
  60%,
  80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
  to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
.tada { -webkit-animation-name: tada; animation-name: tada; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes wobble { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
  30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
  45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
  60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
  75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.wobble { -webkit-animation-name: wobble; animation-name: wobble; }

@-webkit-keyframes jello { from,
  11.1%,
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); }
  33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); }
  44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); }
  55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); }
  66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); }
  77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); }
  88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } }
@keyframes jello { from,
  11.1%,
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); }
  33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); }
  44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); }
  55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); }
  66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); }
  77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); }
  88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } }
.jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center; }

@-webkit-keyframes heartBeat { 0% { -webkit-transform: scale(1); transform: scale(1); }
  14% { -webkit-transform: scale(1.3); transform: scale(1.3); }
  28% { -webkit-transform: scale(1); transform: scale(1); }
  42% { -webkit-transform: scale(1.3); transform: scale(1.3); }
  70% { -webkit-transform: scale(1); transform: scale(1); } }
@keyframes heartBeat { 0% { -webkit-transform: scale(1); transform: scale(1); }
  14% { -webkit-transform: scale(1.3); transform: scale(1.3); }
  28% { -webkit-transform: scale(1); transform: scale(1); }
  42% { -webkit-transform: scale(1.3); transform: scale(1.3); }
  70% { -webkit-transform: scale(1); transform: scale(1); } }
.heartBeat { -webkit-animation-name: heartBeat; animation-name: heartBeat; -webkit-animation-duration: 1.3s; animation-duration: 1.3s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }

@-webkit-keyframes bounceIn { from,
  20%,
  40%,
  60%,
  80%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }
  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
@keyframes bounceIn { from,
  20%,
  40%,
  60%,
  80%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  40% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); }
  80% { -webkit-transform: scale3d(0.97, 0.97, 0.97); transform: scale3d(0.97, 0.97, 0.97); }
  to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } }
.bounceIn { -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-name: bounceIn; animation-name: bounceIn; }

@-webkit-keyframes bounceInDown { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); }
  75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); }
  90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes bounceInDown { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); }
  75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); }
  90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; }

@-webkit-keyframes bounceInLeft { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); }
  75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes bounceInLeft { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); }
  75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); }
  90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; }

@-webkit-keyframes bounceInRight { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); }
  75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); }
  90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes bounceInRight { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); }
  75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); }
  90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; }

@-webkit-keyframes bounceInUp { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); }
  75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
  90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes bounceInUp { from,
  60%,
  75%,
  90%,
  to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); }
  60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); }
  75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
  90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; }

@-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  50%,
  55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }
@keyframes bounceOut { 20% { -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); }
  50%,
  55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); }
  to { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } }
.bounceOut { -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-name: bounceOut; animation-name: bounceOut; }

@-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
  40%,
  45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); }
  to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }
@keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); }
  40%,
  45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); }
  to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }
.bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; }

@-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); }
  to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }
@keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); }
  to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }
.bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; }

@-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); }
  to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }
@keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); }
  to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }
.bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; }

@-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); }
  40%,
  45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); }
  to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }
@keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); }
  40%,
  45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); }
  to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }
.bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; }

@-webkit-keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }
@keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }
.fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; }

@-webkit-keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInDown { from { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; }

@-webkit-keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; }

@-webkit-keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-30px, 0, 0); transform: translate3d(-30px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInLeft { from { opacity: 0; -webkit-transform: translate3d(-30px, 0, 0); transform: translate3d(-30px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; }

@-webkit-keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; }

@-webkit-keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInRight { from { opacity: 0; -webkit-transform: translate3d(30px, 0, 0); transform: translate3d(30px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; }

@-webkit-keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; }

@-webkit-keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInUp { from { opacity: 0; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; }

@-webkit-keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; }

@-webkit-keyframes fadeOut { from { opacity: 1; }
  to { opacity: 0; } }
@keyframes fadeOut { from { opacity: 1; }
  to { opacity: 0; } }
.fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; }

@-webkit-keyframes fadeOutDown { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }
@keyframes fadeOutDown { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }
.fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; }

@-webkit-keyframes fadeOutDownBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }
@keyframes fadeOutDownBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } }
.fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; }

@-webkit-keyframes fadeOutLeft { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }
@keyframes fadeOutLeft { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }
.fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; }

@-webkit-keyframes fadeOutLeftBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }
@keyframes fadeOutLeftBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } }
.fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; }

@-webkit-keyframes fadeOutRight { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }
@keyframes fadeOutRight { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }
.fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; }

@-webkit-keyframes fadeOutRightBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }
@keyframes fadeOutRightBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } }
.fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; }

@-webkit-keyframes fadeOutUp { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }
@keyframes fadeOutUp { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }
.fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; }

@-webkit-keyframes fadeOutUpBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }
@keyframes fadeOutUpBig { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } }
.fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; }

@-webkit-keyframes flip { from { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }
  40% { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }
  50% { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  to { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } }
@keyframes flip { from { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }
  40% { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }
  50% { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  80% { -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  to { -webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } }
.animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; }

@-webkit-keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; }
  40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; }
  80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
  to { -webkit-transform: perspective(400px); transform: perspective(400px); } }
@keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; }
  40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; }
  80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
  to { -webkit-transform: perspective(400px); transform: perspective(400px); } }
.flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; }

@-webkit-keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; }
  40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; }
  80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
  to { -webkit-transform: perspective(400px); transform: perspective(400px); } }
@keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; }
  40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }
  60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; }
  80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
  to { -webkit-transform: perspective(400px); transform: perspective(400px); } }
.flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; }

@-webkit-keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); }
  30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; }
  to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } }
@keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); }
  30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; }
  to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } }
.flipOutX { -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; }

@-webkit-keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); }
  30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; }
  to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } }
@keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); }
  30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; }
  to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } }
.flipOutY { -webkit-animation-duration: 0.75s; animation-duration: 0.75s; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; }

@-webkit-keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; }
  60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; }
  80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; }
  60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; }
  80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; }

@-webkit-keyframes lightSpeedOut { from { opacity: 1; }
  to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } }
@keyframes lightSpeedOut { from { opacity: 1; }
  to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } }
.lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; }

@-webkit-keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; }
  to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
@keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; }
  to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
.rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; }

@-webkit-keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
@keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; }

@-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
@keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
.rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; }

@-webkit-keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
@keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
.rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; }

@-webkit-keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
@keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } }
.rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; }

@-webkit-keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; }
  to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } }
@keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; }
  to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } }
.rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; }

@-webkit-keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } }
@keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } }
.rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; }

@-webkit-keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } }
@keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } }
.rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; }

@-webkit-keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } }
@keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; }
  to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } }
.rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; }

@-webkit-keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } }
@keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; }
  to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } }
.rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; }

@-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
  20%,
  60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
  40%,
  80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; }
  to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } }
@keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
  20%,
  60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; }
  40%,
  80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; }
  to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } }
.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-name: hinge; animation-name: hinge; }

@-webkit-keyframes jackInTheBox { from { opacity: 0; -webkit-transform: scale(0.1) rotate(30deg); transform: scale(0.1) rotate(30deg); -webkit-transform-origin: center bottom; transform-origin: center bottom; }
  50% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); }
  70% { -webkit-transform: rotate(3deg); transform: rotate(3deg); }
  to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } }
@keyframes jackInTheBox { from { opacity: 0; -webkit-transform: scale(0.1) rotate(30deg); transform: scale(0.1) rotate(30deg); -webkit-transform-origin: center bottom; transform-origin: center bottom; }
  50% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); }
  70% { -webkit-transform: rotate(3deg); transform: rotate(3deg); }
  to { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } }
.jackInTheBox { -webkit-animation-name: jackInTheBox; animation-name: jackInTheBox; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); }
  to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; }

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } }
@keyframes rollOut { from { opacity: 1; }
  to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } }
.rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; }

@-webkit-keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  50% { opacity: 1; } }
@keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  50% { opacity: 1; } }
.zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; }

@-webkit-keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; }

@-webkit-keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; }

@-webkit-keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; }

@-webkit-keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  60% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; }

@-webkit-keyframes zoomOut { from { opacity: 1; }
  50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  to { opacity: 0; } }
@keyframes zoomOut { from { opacity: 1; }
  50% { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); }
  to { opacity: 0; } }
.zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; }

@-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; }

@-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }
  to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } }
@keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }
  to { opacity: 0; -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } }
.zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; }

@-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }
  to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } }
@keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }
  to { opacity: 0; -webkit-transform: scale(0.1) translate3d(2000px, 0, 0); transform: scale(0.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } }
.zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; }

@-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
@keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  to { opacity: 0; -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
.zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; }

@-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; }

@-webkit-keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; }

@-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; }

@-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; }
  to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; }

@-webkit-keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }
@keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } }
.slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; }

@-webkit-keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }
@keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } }
.slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; }

@-webkit-keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }
@keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } }
.slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; }

@-webkit-keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }
@keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
  to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } }
.slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; }

.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }

.animated.delay-03s { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }

.animated.delay-05s { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; }

.animated.delay-08s { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; }

.animated.delay-1s { -webkit-animation-delay: 1s; animation-delay: 1s; }

.animated.delay-2s { -webkit-animation-delay: 2s; animation-delay: 2s; }

.animated.delay-3s { -webkit-animation-delay: 3s; animation-delay: 3s; }

.animated.delay-4s { -webkit-animation-delay: 4s; animation-delay: 4s; }

.animated.delay-5s { -webkit-animation-delay: 5s; animation-delay: 5s; }

@media screen and (min-width: 768px) { /*PC Only*/
  .animated.pc-delay-03s { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }
  .animated.pc-delay-05s { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; }
  .animated.pc-delay-08s { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; }
  .animated.pc-delay-1s { -webkit-animation-delay: 1s; animation-delay: 1s; }
  .animated.pc-delay-2s { -webkit-animation-delay: 2s; animation-delay: 2s; }
  .animated.pc-delay-3s { -webkit-animation-delay: 3s; animation-delay: 3s; }
  .animated.pc-delay-4s { -webkit-animation-delay: 4s; animation-delay: 4s; }
  .animated.pc-delay-5s { -webkit-animation-delay: 5s; animation-delay: 5s; } }
@media screen and (max-width: 767px) { /*SP Only*/
  .animated.sp-delay-03s { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }
  .animated.sp-delay-05s { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; }
  .animated.sp-delay-08s { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; }
  .animated.sp-delay-1s { -webkit-animation-delay: 1s; animation-delay: 1s; }
  .animated.sp-delay-2s { -webkit-animation-delay: 2s; animation-delay: 2s; }
  .animated.sp-delay-3s { -webkit-animation-delay: 3s; animation-delay: 3s; }
  .animated.sp-delay-4s { -webkit-animation-delay: 4s; animation-delay: 4s; }
  .animated.sp-delay-5s { -webkit-animation-delay: 5s; animation-delay: 5s; } }
.animated.fast { -webkit-animation-duration: 800ms; animation-duration: 800ms; }

.animated.faster { -webkit-animation-duration: 500ms; animation-duration: 500ms; }

.animated.slow { -webkit-animation-duration: 2s; animation-duration: 2s; }

.animated.slowly { -webkit-animation-duration: 2.5s; animation-duration: 2.5s; }

.animated.slower { -webkit-animation-duration: 3s; animation-duration: 3s; }

@media (print), (prefers-reduced-motion: reduce) { .animated { -webkit-animation-duration: 1ms !important; animation-duration: 1ms !important; -webkit-transition-duration: 1ms !important; transition-duration: 1ms !important; -webkit-animation-iteration-count: 1 !important; animation-iteration-count: 1 !important; } }
/*************************************** 矢印
*****************************************/
/* title.scss
***************************************
 title

*****************************************/
.contents-title { display: block; font-weight: bold; line-height: 1.3; }
@media print, screen and (min-width: 1030px) { .contents-title.ll-size { font-size: 3rem; }
  .contents-title.l-size { font-size: 2.4rem; }
  .contents-title.m-size { font-size: 2rem; }
  .contents-title.s-size { font-size: 1.8rem; } }
@media screen and (max-width: 1029px) { .contents-title.ll-size { font-size: 2.5rem; }
  .contents-title.l-size { font-size: 2rem; }
  .contents-title.m-size { font-size: 1.8rem; }
  .contents-title.s-size { font-size: 1.8rem; } }

.month_title { border-bottom: solid 1px #777; padding-bottom: 20px; }
.month_title .ico { padding: 10px; }

/***************************************
 title_bar

*****************************************/
.title_bar { font-weight: 700; padding: 15px 0; }
@media print, screen and (min-width: 1030px) { .title_bar { background: #E1E8F5; font-size: 2.4rem; padding-left: 20px; } }
@media screen and (max-width: 1029px) { .title_bar { background: #7C95C2; font-size: 1.8rem; padding: 10px 5%; color: white; position: relative; }
  .title_bar::before, .title_bar::after { content: ""; display: block; width: 15px; height: 3px; background: white; position: absolute; right: 5%; top: 23px; }
  .title_bar::after { transform: rotate(90deg); }
  .title_bar.open::after { display: none; }
  .title_bar.no_nav::before, .title_bar.no_nav::after { display: none; } }
.title_bar.pic_bg { padding-top: 0; padding-bottom: 0; background-size: auto 100% !important; background-repeat: no-repeat; background-position: right center; }
.title_bar.pic_bg::before, .title_bar.pic_bg::after { display: none; }
@media print, screen and (min-width: 1030px) { .title_bar.pic_bg { height: 200px; line-height: 200px; padding-left: 7%; } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg { background-color: #E1E8F5; color: #333333; height: 120px; line-height: 120px; font-size: 2rem; padding-left: 5%; } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.course { background-image: url(../img/course/course_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.course { background-image: url(../img/course/course_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.about { background-image: url(../img/about/about_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.about { background-image: url(../img/about/about_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.campuslife { background-image: url(../img/campuslife/campuslife_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.campuslife { background-image: url(../img/campuslife/campuslife_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.career { background-image: url(../img/career/career_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.career { background-image: url(../img/career/career_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.story { background-image: url(../img/story/story_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.story { background-image: url(../img/story/story_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.library { background-image: url(../img/library/library_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.library { background-image: url(../img/library/library_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.pocket { background-image: url(../img/pocket/pocket_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.pocket { background-image: url(../img/pocket/pocket_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.gallery { background-image: url(../img/gallery/gallery_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.gallery { background-image: url(../img/gallery/gallery_title_bg_sp.png); } }
@media screen and (min-width: 1030px) { .title_bar.pic_bg.en { background-image: url(../img/en/en_title_bg.png); } }
@media screen and (max-width: 1029px) { .title_bar.pic_bg.en { background-image: url(../img/en/en_title_bg_sp.png); } }

/***************************************
 その他パーツ

*****************************************/
/* 各ページタイトル */
.contents-title.name { line-height: 130%; margin-bottom: 40px; }
@media print, screen and (min-width: 1030px) { .contents-title.name { font-size: 3rem; } }
@media screen and (max-width: 1029px) { .contents-title.name { font-size: 2.5rem; } }
.contents-title.name span { font-size: 1.7rem; display: block; }
.contents-title.name::after { content: ""; display: block; width: 80px; height: 10px; margin-top: 20px; background: #2F569F; }

/* ページタイトル 太さノーマル */
.copy { font-weight: normal; line-height: 150%; }
@media print, screen and (min-width: 1030px) { .copy { margin: 70px auto 50px; } }
@media screen and (max-width: 1029px) { .copy { margin: 40px auto; } }

/*1階層下のページタイトル*/
.name-sub_title { background: #2F569F; color: white; display: inline-block; padding: 10px 20px; }

.bg-title { border-radius: 10px; padding: 15px 0; background: #E1E8F5; }

/*■付き見出し*/
.square-title { position: relative; padding-left: 30px; }
@media print, screen and (min-width: 1030px) { .square-title { font-size: 2rem; } }
@media screen and (max-width: 1029px) { .square-title { font-size: 1.8rem; } }
.square-title::before { content: ""; display: block; position: absolute; width: 20px; height: 20px; left: 0; top: 3px; background: #7C95C2; }

/*************************************** 矢印
*****************************************/
/*　btn.scss
****************************************

btn　共通

*****************************************/
.btn a { background: #2F569F; display: inline-block; text-align: left; padding: 10px 15px; color: white; }
@media print, screen and (min-width: 1030px) { .btn a { transition: ease .3s; }
  .btn a:hover { background-color: #7C95C2; } }
.btn.arrow a { padding-right: 40px; position: relative; }
.btn.arrow a::after { content: ""; position: absolute; margin-top: -4px; display: block; background-size: contain !important; width: 25px; height: 8px; top: 50%; right: 20px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.more a { min-width: 150px; }
.btn.back a { text-align: right; min-width: 150px; padding-right: 15px; padding-left: 40px; font-size: 1.2rem; position: relative; }
.btn.back a::after { content: ""; position: absolute; margin-top: -4px; display: block; background-size: contain !important; width: 25px; height: 8px; top: 50%; right: 20px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.back a::after { background: url("../img/common/arrow_w_re.svg"); right: inherit; height: 7px; left: 20px; }
.btn.under a { width: 340px; min-width: 200px; font-size: 1.4rem; position: relative; }
.btn.under a::after { content: ""; position: absolute; margin-top: -10px; display: block; background-size: contain !important; width: 7px; height: 20px; top: 50%; right: 24px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.under a::after { background: url("../img/common/arrow_w_under.svg"); }
.btn.pdf a, .btn.excel a { padding: 15px 40px 15px 70px; width: 475px; max-width: 100%; line-height: 130%; position: relative; }
.btn.pdf a::after, .btn.excel a::after { content: ""; position: absolute; margin-top: -4px; display: block; background-size: contain !important; width: 25px; height: 8px; top: 50%; right: 20px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.pdf a::before, .btn.excel a::before { content: ""; display: block; position: absolute; width: 25px; height: 31px; top: 50%; margin-top: -15px; background: url(../img/common/pdf.svg) no-repeat center; background-size: 100% auto; left: 25px; }
.btn.excel a::before { background: url(../img/common/excel.svg) no-repeat center; }
.btn.tel a { width: 370px; text-align: center; font-weight: bold; position: relative; }
.btn.tel a::after { content: ""; position: absolute; margin-top: -4px; display: block; background-size: contain !important; width: 25px; height: 8px; top: 50%; right: 20px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.tel a::before { content: ""; display: block; position: absolute; width: 27px; height: 27px; top: 50%; margin-top: -13.5px; background: url(../img/common/tel.svg) no-repeat center; background-size: 100% auto; left: 25px; }
.btn.mail a { width: 370px; text-align: center; font-weight: bold; position: relative; }
.btn.mail a::after { content: ""; position: absolute; margin-top: -4px; display: block; background-size: contain !important; width: 25px; height: 8px; top: 50%; right: 20px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.mail a::before { content: ""; display: block; position: absolute; width: 28px; height: 18px; top: 50%; margin-top: -9px; background: url(../img/common/mail_w.svg) no-repeat center; background-size: 100% auto; left: 25px; }
.btn.out a { width: auto; padding: 5px 50px 5px 15px; position: relative; }
.btn.out a::after { content: ""; position: absolute; margin-top: -9.75px; display: block; background-size: contain !important; width: 19.5px; height: 19.5px; top: 50%; right: 5px; background: url(../img/common/arrow_w.svg) no-repeat center; }
.btn.out a::after { background: url("../img/common/link_out_w.svg"); margin-top: -12.5px; }

/*角丸のリンク集*/
@media print, screen and (min-width: 1030px) { .page_nav { padding: 40px 0 30px; } }
@media screen and (max-width: 1029px) { .page_nav { padding: 40px 0; } }
.page_nav.sp-block { border: none; padding-bottom: 0; }
.page_nav ul { display: flex; flex-wrap: wrap; }
.page_nav a { display: block; border-radius: 20px; color: white; font-weight: 700; padding: 3px 15px; margin-bottom: 10px; margin-right: 10px; background: #7C95C2; }

/****************************************

パンクズ

*****************************************/
@media print, screen and (min-width: 1030px) { .pankuzu { margin-bottom: 40px; padding: 10px 20px; } }
@media screen and (max-width: 1029px) { .pankuzu { margin-bottom: 20px; padding: 10px 5%; } }
.pankuzu ul { display: flex; flex-wrap: wrap; font-size: 1.3rem; }
.pankuzu ul li:not(:first-child)::before { content: ">"; padding: 0 10px; }

/***************************************

pagination

*****************************************/
/* 入試のやつをとりあえずコピペしてます　*/
.pagination { text-align: center; font-weight: bold; width: 100%; }
.pagination ul { display: flex; align-content: center; justify-content: center; margin: auto; }
@media print, screen and (min-width: 1030px) { .pagination { font-size: 2.4rem; } }
@media screen and (max-width: 1029px) { .pagination { font-size: 1.5rem; } }
.pagination li { margin: 5px; }
.pagination a { display: block !important; color: #2F569F; background: white; text-decoration: none; border: solid 1px #2F569F; }
@media print, screen and (min-width: 1030px) { .pagination .page-numbers { width: 50px; height: 50px; line-height: 50px; margin: 0 10px; } }
@media screen and (max-width: 1029px) { .pagination .page-numbers { width: 30px; height: 30px; line-height: 30px; margin: 0 5px; } }
.pagination .inactive, .pagination span { padding: 0; width: 50px; height: 50px; line-height: 50px; text-align: center; display: inline-block; }
.pagination .pagination-last { letter-spacing: .3em; }
.pagination .current { background-color: #2F569F; color: #fff; }

@media print, screen and (min-width: 1030px) { .pagination.page_single { margin-top: 60px; } }
@media screen and (max-width: 1029px) { .pagination.page_single { margin: 20px 0 40px; } }
@media screen and (max-width: 1029px) { .pagination.page_single div { transform: scale(0.7); } }
.pagination.page_single div a { border: solid 1px #2F569F; display: block; width: 70px; height: 70px; background-color: #2F569F; position: relative; }
.pagination.page_single div a span { display: block; text-align: center; color: #2F569F; height: auto; line-height: normal; font-size: 1.2rem; bottom: -30px; left: 0; width: 100%; position: absolute; }
.pagination.page_single div a::after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; display: block; background: url(../img/common/arrow_w.svg) no-repeat center; background-size: 60% auto; }
.pagination.page_single div.new a::after { transform: scale(-1, 1); }
.pagination.page_single div.archive a::after { background: url(../img/common/arc_ico.svg) no-repeat center; background-size: contain; width: 30px; height: 27px; left: 50%; top: 50%; margin-top: -13.5px; margin-left: -15px; }
@media print, screen and (min-width: 1030px) { .pagination.page_single div.archive a { margin-left: 10px; margin-right: 10px; } }

/*************************************** 矢印
*****************************************/
/****************************************
 post single

*****************************************/
.post_text { text-align: left; }
.post_text p { margin-bottom: 20px; word-break: break-all; }
.post_text a { text-decoration: underline; color: #2F569F; font-weight: 700; }
.post_text h1, .post_text h2, .post_text h3, .post_text h4, .post_text h5, .post_text h6, .post_text h7 { font-weight: bold; margin-bottom: 15px; }
.post_text h1 { font-size: 2.6rem; }
.post_text h2 { font-size: 2.4rem; }
.post_text h3 { font-size: 2.2rem; }
.post_text h4 { font-size: 1.8rem; }
.post_text h5 { font-size: 1.8rem; }
.post_text h6 { font-size: 1.8rem; }
.post_text h7 { font-size: 1.8rem; }
.post_text b, .post_text strong { font-size: 1.8rem; }
.post_text img { max-width: 100%; width: auto; height: auto; margin-bottom: 10px; }
.post_text em { font-style: italic; }
.post_text ul, .post_text ol { list-style: outside; margin-left: 20px; font-weight: 700; letter-spacing: 0.08em; line-height: 2.2; }
.post_text ol { list-style-type: decimal; }
.post_text .video { position: relative; width: 100%; padding-top: 56.25%; }
.post_text .video iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; }

.wp-caption-text { font-size: 80%; line-height: 150%; text-align: right; }

@media print, screen and (min-width: 1030px) { .post_text a img, .post_text .lb a img, .lb a img, .lb .lb a img { transition: ease .3s; }
  .post_text a:hover img, .post_text .lb a:hover img, .lb a:hover img, .lb .lb a:hover img { opacity: .6; } }
