@charset "UTF-8";
@charset "UTF-8";


@import url("https://fonts.googleapis.com/css?family=Cabin:500");
html {
color: #000;
background: #FFF;
}
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
fieldset, img {
border: 0;
}
address, caption, cite, code, dfn, em, strong, th, var {
font-style: normal;
font-weight: normal;
}
ol, ul {
list-style: none;
}
caption, th {
text-align: left;
}
h1, h2, h3, h4, h5, h6 {
font-size: 100%;
font-weight: normal;
}
q:before, q:after {
content: "";
}
abbr, acronym {
border: 0;
font-variant: normal;
}
sup {
vertical-align: text-top;
}
sub {
vertical-align: text-bottom;
}
input, textarea, select {
font-family: inherit;
font-size: inherit;
font-weight: inherit;
*font-size: 100%;
}
legend {
color: #000;
}
#yui3-css-stamp.cssreset {
display: none;
}
main {
display: block;
}
html {
box-sizing: border-box;
}
*, *::after, *::before {
box-sizing: inherit;
}
html {
box-sizing: border-box;
}
*, *::after, *::before {
box-sizing: inherit;
} body {
position: relative;
left: 0;
overflow-x: hidden;
}
#slide_menu {
position: fixed;
top: 0;
left: -250px;
width: 250px;
height: 100%;
} #slide_menu ul li {
border: 1px solid #EB613B;
}
#slide_menu ul li a {
padding: 10px 6% 10px 2%;
display: block;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
#slide_menu ul li a::after {
clear: both;
content: "";
display: table;
}
#slide_menu ul li a .title {
display: block;
float: left;
}
#slide_menu ul li a .subtitle {
display: block;
float: right;
}
#slide_menu ul li .type01 {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_03.png) no-repeat 98% center;
background-size: auto 40%;
color: #EB613B;
font-size: 0.85rem;
font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
text-decoration: none;
}
#slide_menu ul li .type02 {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_04.png) no-repeat 98% center;
background-size: auto 40%;
color: #FFF;
background-color: #EB613B;
font-size: 0.85rem;
font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
text-decoration: none;
}
div#button img {
width: 10%;
}
div#button img#on {
display: none;
}
div#button.on img#on {
display: none;
}
div#button.on img#off {
display: block;
}
div#button.off img#on {
display: block;
}
div#button.off img#off {
display: none;
}
@media print, screen and (max-width: 1000px) {
.pc_only {
display: block;
}
}
@media screen and (min-width: 1001px) {
.pc_only {
display: block;
}
}
@media screen and (max-width: 640px) {
.pc_only {
display: none;
}
}
@media screen and (min-width: 1001px) {
.sp_only {
display: none;
}
}
@media print, screen and (max-width: 1000px) {
.sp_only {
display: none;
}
}
@media screen and (max-width: 640px) {
.sp_only {
display: block;
}
}
header {
margin: 1% auto;
padding: 0% 0;
}
@media screen and (min-width: 1001px) {
header {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
header {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
header {
width: 98%;
margin: 0 auto;
}
}
header .mainhetader {
width: 100%;
}
header .mainhetader .top_header {
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
header .mainhetader .top_header::after {
clear: both;
content: "";
display: table;
}
header .mainhetader .top_header .menubotton_wapper {
width: 71.0405%;
float: left;
margin: 2% 0 0 0;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
header .mainhetader .top_header .menubotton_wapper::after {
clear: both;
content: "";
display: table;
}
header .mainhetader .top_header .menubotton_wapper h1 {
width: 63.1952%;
float: left;
color: #404040;
font-size: 0.85rem;
font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}
header .mainhetader .top_header .menubotton_wapper ul {
width: 30.2011%;
text-align: left;
float: right;
}
header .mainhetader .top_header .menubotton_wapper ul li {
display: inline-table;
margin: 0 7% 0 0;
}
header .mainhetader .top_header .menubotton_wapper ul li:last-child {
margin: 0;
}
header .mainhetader .top_header .menubotton_wapper ul li a {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_03.png) no-repeat left center;
background-size: auto 100%;
color: #404040;
text-decoration: none;
padding: 0 0 0 25px;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
header .mainhetader .top_header .menubotton_wapper ul li a:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_04.png) no-repeat left center;
background-size: auto 100%;
}
header .mainhetader .top_header .botton {
width: 25.9511%;
float: right;
}
header .mainhetader .top_header .botton img {
width: 100%;
height: auto;
}
header .mainhetader .bottome_header {
max-width: 100%;
margin-left: auto;
margin-right: auto;
margin: 0% 0 2% 0;
}
header .mainhetader .bottome_header::after {
clear: both;
content: "";
display: table;
}
header .mainhetader .bottome_header .top {
width: 57.7761%;
float: left;
}
header .mainhetader .bottome_header .top img {
width: 100%;
height: auto;
}
header .mainhetader .bottome_header .tel_header {
width: 25.8381%;
float: right;
margin: 2% 0 0 0;
padding: 0 1% 0 0;
}
header .mainhetader .bottome_header .tel_header img {
width: 100%;
height: auto;
}
.head_botton_sp {
max-width: 100%;
margin-left: auto;
margin-right: auto;
width: 98%;
margin: 0 auto;
}
.head_botton_sp::after {
clear: both;
content: "";
display: table;
}
.head_botton_sp ul {
float: left;
margin: 2% 0 0 0;
width: 50.1504%;
}
.head_botton_sp ul li {
display: inline-table;
margin: 0 2% 0 0;
}
.head_botton_sp ul li:last-child {
margin: 0;
}
.head_botton_sp ul li a {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_03.png) no-repeat left 60%;
background-size: auto 100%;
color: #404040;
text-decoration: none;
padding: 0 0 0 20px;
font-size: 0.75rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
.head_botton_sp .botton {
float: right;
width: 48.8019%;
}
.head_botton_sp .botton img {
width: 100%;
height: auto;
}
.telbox_sp {
text-align: right;
max-width: 100%;
margin-left: auto;
margin-right: auto;
margin: 2% auto 2% auto;
}
.telbox_sp::after {
clear: both;
content: "";
display: table;
}
.telbox_sp #button {
width: 10%;
float: left;
}
.telbox_sp #button img {
width: 100%;
height: auto;
}
.telbox_sp .telbox_l {
width: 49.8019%;
float: right;
margin: 2% 1% 2% 0%;
}
.telbox_sp .telbox_l img {
width: 100%;
height: auto;
}
.h1_sp {
color: #404040;
font-size: 0.85rem;
font-family: "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}
.top_sp {
margin: 2% auto;
width: 98%;
}
.top_sp img {
width: 100%;
height: auto;
}
.menu_wapper ul {
max-width: 100%;
margin-left: auto;
margin-right: auto;
margin: 0 auto;
}
@media print, screen and (max-width: 1000px) {
.menu_wapper ul {
display: block;
}
}
@media screen and (min-width: 1001px) {
.menu_wapper ul {
display: block;
}
}
@media screen and (max-width: 640px) {
.menu_wapper ul {
display: none;
}
}
@media screen and (min-width: 1001px) {
.menu_wapper ul {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.menu_wapper ul {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.menu_wapper ul {
width: 98%;
margin: 0 auto;
}
}
.menu_wapper ul::after {
clear: both;
content: "";
display: table;
}
.menu_wapper ul li {
width: 20%;
float: left;
}
.menu_wapper ul li a {
display: block;
color: #000;
text-align: center;
text-decoration: none;
}
.menu_wapper ul li a img {
width: 100%;
height: auto;
display: block;
}
.boon {
text-align: center;
width: 100%;
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/img_innner_back.png) repeat-x top center;
background-size: auto 100%;
padding: 3% 0 5.5% 0;
margin: 0 0 2% 0;
}
.boon h2 {
text-align: center;
}
.boon h2 img {
width: auto;
height: 70px;
}
@media screen and (max-width: 640px) {
.boon h2 img {
height: 40px;
}
}
.pankuzu {
padding-top: 3%;
padding-bottom: 3%;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
@media screen and (min-width: 1001px) {
.pankuzu {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.pankuzu {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.pankuzu {
width: 98%;
margin: 0 auto;
}
}
.pankuzu a {
color: #009FE8;
}
html {
box-sizing: border-box;
}
*, *::after, *::before {
box-sizing: inherit;
}
@media screen and (min-width: 1001px) {
.bottons {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.bottons {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.bottons {
width: 98%;
margin: 0 auto;
}
}
.bottons .bunner_list {
width: 65.266%;
position: relative;
margin: 2% auto;
}
@media screen and (max-width: 640px) {
.bottons .bunner_list {
width: 98%;
margin: 5% auto 0 auto;
}
}
.bottons .bunner_list img {
width: 100%;
height: auto;
}
.bottons .bunner_list .faq_botton_wa {
width: 21.4826%;
position: absolute;
top: 29%;
left: 30%;
}
.bottons .bunner_list .faq_botton_contact {
width: 39.9395%;
right: 7%;
position: absolute;
top: 29%;
}
.bottons .bunner_list .tel_box {
width: 62.4811%;
position: absolute;
right: 7%;
bottom: 24%;
}
#pagetop {
position: fixed;
bottom: 50px;
right: 20px;
z-index: 100;
margin-top: 50px;
}
@media screen and (max-width: 640px) {
#pagetop {
bottom: 10%;
right: 2%;
position: relative;
margin-top: 5%;
}
}
p#pagetop a {
text-decoration: none;
width: 112px;
margin-top: 50px;
text-align: center;
display: block;
border-radius: 5px;
}
@media screen and (max-width: 640px) {
p#pagetop a {
text-align: center;
margin: 0 auto;
}
}
p#pagetop a img {
width: 50%;
}
@media screen and (max-width: 640px) {
p#pagetop a img {
width: 30%;
}
}
footer {
margin: 1% 0 0 0;
}
@media screen and (max-width: 640px) {
footer {
margin: 0% 0 0 0;
}
}
footer .mainfotter {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/imt_footer_back.png) repeat-x bottom center;
background-size: auto 100%;
}
@media screen and (max-width: 640px) {
footer .mainfotter {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/imt_footer_back_sp.png) repeat-x bottom center;
background-size: auto 100%;
}
}
.mainfotter_wapper_pc {
padding: 6% 0 1% 0;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
@media screen and (min-width: 1001px) {
.mainfotter_wapper_pc {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.mainfotter_wapper_pc {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.mainfotter_wapper_pc {
width: 98%;
margin: 0 auto;
}
}
.mainfotter_wapper_pc::after {
clear: both;
content: "";
display: table;
}
.mainfotter_wapper_pc .nav_menu {
width: 30%;
float: left;
margin: 0 5% 0 0;
}
.mainfotter_wapper_pc .footer_address_area {
width: 40%;
float: left;
margin: 0 0% 0 0;
}
.mainfotter_wapper_pc .footer_carender {
width: 18%;
float: right;
margin: 0 0% 0 0;
}
.nav_menu ul {
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.nav_menu ul::after {
clear: both;
content: "";
display: table;
}
.nav_menu ul li {
width: 46%;
float: left;
margin: 1% 0;
display: block;
}
@media screen and (max-width: 640px) {
.nav_menu ul li {
margin: 0% 0 2% 0;
}
}
.nav_menu ul li:nth-child(2n) {
float: right;
}
.nav_menu ul li a {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_02.png) no-repeat 2% center;
background-size: auto 65%;
padding: 0 0 0 15px;
color: #000;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: flex;
}
@media screen and (max-width: 640px) {
.nav_menu ul li a {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 2px 0 2px 15px;
background-color: #FFF;
border: 1px solid #1d4088;
}
}
.nav_menu ul li a:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_02.png) no-repeat 2% center;
background-size: auto 65%;
padding: 0 0 0 15px;
color: #000;
background-color: #fff000;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: flex;
}
@media screen and (max-width: 640px) {
.nav_menu ul li a:hover {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 2px 0 2px 15px;
background-color: #FFF;
border: 1px solid #1d4088;
}
}
.nav_menu ul li span {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_02.png) no-repeat 2% center;
background-size: auto 71%;
padding: 0 0 0 15px;
color: #000;
background-color: #fff000;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: flex;
}
@media screen and (max-width: 640px) {
.nav_menu ul li span {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 2px 0 2px 15px;
border: 1px solid #1d4088;
}
}
.nav_menu ul li b {
padding: 0 0 0 15px;
background-color: none;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: flex;
}
@media screen and (max-width: 640px) {
.nav_menu ul li b {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 2px 0 2px 15px;
background-color: #DDE9E9;
border: 1px solid #DDE9E9;
}
}
.footer_address_area a {
display: block;
width: 69.265%;
margin: 0 0 3% 0;
}
.footer_address_area a img {
width: 100%;
height: auto;
}
.footer_address_area p {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: block;
line-height: 150%;
margin: 2% 0 0 0;
}
.calendar img {
width: 100%;
height: auto;
}
.calendar li {
margin: 2% 0;
display: block;
width: 100%;
}
.calendar li:nth-child(2n) {
float: right;
}
@media screen and (max-width: 640px) {
.calendar li {
margin: 0% 0;
}
}
.calendar li a {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_01.png) no-repeat 2% center;
background-size: auto 55%;
padding: 0 0 0 15px;
color: #000;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: flex;
}
@media screen and (max-width: 640px) {
.calendar li a {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 0 0 0 15px;
}
}
.calendar li a:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_04.png) no-repeat 2% center;
background-size: auto 55%;
padding: 0 0 0 15px;
color: #000;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
}
@media screen and (max-width: 640px) {
.calendar li a:hover {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 0 0 0 15px;
}
}
.calendar li span {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/icon/icon_arrow_type_04.png) no-repeat 2% center;
background-size: auto 55%;
padding: 0 0 0 15px;
color: #000;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
text-decoration: none;
display: flex;
}
@media screen and (max-width: 640px) {
.calendar li span {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
padding: 0 0 0 15px;
}
}
.calendar li b {
padding: 0 0 0 10px;
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
@media screen and (max-width: 640px) {
.calendar li b {
font-size: 0.65rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
}
address {
background: #FFF;
padding: 2% 0;
text-align: center;
font-size: 0.65rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
}
.mainfotter_wapper_sp {
max-width: 100%;
margin-left: auto;
margin-right: auto;
padding: 15% 0 1% 0;
}
@media screen and (min-width: 1001px) {
.mainfotter_wapper_sp {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.mainfotter_wapper_sp {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.mainfotter_wapper_sp {
width: 98%;
margin: 0 auto;
}
}
.mainfotter_wapper_sp::after {
clear: both;
content: "";
display: table;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers {
max-width: 100%;
margin-left: auto;
margin-right: auto;
width: 98%;
margin: 0 auto;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers::after {
clear: both;
content: "";
display: table;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers .nav_menu {
width: 100%;
margin: 0 0% 5% 0;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers .footer_carender {
width: 100%;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers .footer_carender::after {
clear: both;
content: "";
display: table;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers .footer_carender .calendar_botton {
width: 48%;
display: block;
float: left;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers .footer_carender .calendar_botton img {
width: 80%;
height: auto;
}
.mainfotter_wapper_sp .mainfotter_wapper_wappers .footer_carender ul {
width: 48%;
float: right;
}
.mainfotter_wapper_sp .footer_address_area {
width: 85%;
margin: 5% auto;
}
html {
box-sizing: border-box;
}
*, *::after, *::before {
box-sizing: inherit;
}
html {
box-sizing: border-box;
}
*, *::after, *::before {
box-sizing: inherit;
}
.slaider {
width: 100%;
text-align: center;
position: relative;
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/index/slader_back.png);
padding: 2% 0 4% 0;
}
.slaider .slider_wapper {
width: 100%;
text-align: left;
position: relative;
overflow: hidden;
}
.slaider .menu_wapper {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
z-index: 99999999;
}
.slider_wapper ul, .slider_wapper li {
float: left;
display: inline;
overflow: hidden;
margin: 0;
}
.slider_wapper ul:after {
content: ".";
height: 0;
clear: both;
display: block;
visibility: hidden;
}
.slider_wapper ul {
display: inline-block;
overflow: hidden;
}
.slider_wapper li a {
display: block;
width: 100%;
margin: 0 auto;
}
.slider_wapper li a img {
width: 100%;
height: auto;
margin: 0 2%;
}
@media screen and (max-width: 640px) {
.slider_wapper li a img {
width: 100%;
margin: 0 0%;
height: auto;
}
}
.wideslider_base {
top: 0;
position: absolute;
}
.wideslider_wrap {
top: 0;
position: absolute;
overflow: hidden;
}
.slider_prev,
.slider_next {
top: 0;
overflow: hidden;
position: absolute;
z-index: 100;
cursor: pointer;
background-size: 100% auto;
}
.slider_prev {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/prev.png) no-repeat right 45%;
}
@media screen and (max-width: 640px) {
.slider_prev {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/prev.png) no-repeat right center;
background-size: 100% auto;
}
}
.slider_prev:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/prev_hover.png) no-repeat right 45%;
}
@media screen and (max-width: 640px) {
.slider_prev:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/prev_hover.png) no-repeat right center;
background-size: 100% auto;
}
}
.slider_next {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/next.png) no-repeat left 45%;
}
@media screen and (max-width: 640px) {
.slider_next {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/next.png) no-repeat left center;
background-size: 100% auto;
}
}
.slider_next:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/next_hovert.png) no-repeat left 45%;
}
@media screen and (max-width: 640px) {
.slider_next:hover {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/next_hovert.png) no-repeat right center;
background-size: 100% auto;
}
}
.menu_wapper {
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/menu_wapper_back.png);
background-repeat: repeat-x;
background-size: auto 100%;
padding: 12% 0 0.5% 0;
background-position: bottom center;
}
@media screen and (max-width: 640px) {
.menu_wapper {
padding: 16% 0 1% 0;
}
}
@media screen and (min-width: 1001px) {
.index_wapper {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.index_wapper {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.index_wapper {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.index_wapper {
width: 100%;
}
}
.index_wapper .index_inner {
width: 96%;
margin: 5% auto;
}
@media screen and (max-width: 640px) {
.index_wapper .index_inner {
width: 100%;
margin: 5% auto 0 auto;
}
}
.index_wapper .index_inner h2 {
width: 81.3053%;
margin: 0 auto;
}
@media screen and (max-width: 640px) {
.index_wapper .index_inner h2 {
width: 100%;
margin: 0 auto 4% auto;
}
}
.index_wapper .index_inner h2 img {
width: 100%;
height: auto;
}
.index_wapper .index_inner ul {
width: 100%;
margin: 3% 0 0 0;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.index_wapper .index_inner ul::after {
clear: both;
content: "";
display: table;
}
@media screen and (max-width: 640px) {
.index_wapper .index_inner ul {
width: 75.6341%;
margin: 0 auto;
}
}
.index_wapper .index_inner ul li {
width: 31.25%;
float: left;
margin: 0 3.125% 0% 0;
}
@media screen and (max-width: 640px) {
.index_wapper .index_inner ul li {
width: 100%;
margin: 0 auto 5% auto;
}
}
.index_wapper .index_inner ul li:nth-child(3n) {
margin: 0 0 3.125% 0;
}
@media screen and (max-width: 640px) {
.index_wapper .index_inner ul li:nth-child(3n) {
width: 100%;
margin: 0 auto 5% auto;
}
}
.index_wapper .index_inner ul li img {
width: 100%;
height: auto;
}
.family_wapper {
width: 100%;
margin: 4% 0 0 0;
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/index/family_wapper_back.png) repeat;
padding: 2% 0 2% 0;
}
@media screen and (min-width: 1001px) {
.family_wapper .family_inner {
width: 1000px;
margin: 0 auto;
}
}
@media print, screen and (max-width: 1000px) {
.family_wapper .family_inner {
width: 98%;
margin: 0 auto;
}
}
@media screen and (max-width: 640px) {
.family_wapper .family_inner {
width: 98%;
margin: 0 auto;
}
}
.family_wapper .family_inner h3 {
width: 40.8515%;
margin: 0 auto 2% auto;
}
@media screen and (max-width: 640px) {
.family_wapper .family_inner h3 {
width: 60%;
}
}
.family_wapper .family_inner h3 img {
width: 100%;
height: auto;
}
.family_wapper .family_inner .pref_box {
text-align: center;
}
.family_wapper .family_inner .pref_box h4 {
font-size: 1.125rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
margin: 2% 0 0 0;
font-weight: bold;
}
.family_wapper .family_inner .pref_box p {
font-size: 1rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
margin: 1% 0;
}
.family_wapper .family_inner ul {
width: 94.7027%;
max-width: 100%;
margin-left: auto;
margin-right: auto;
}
.family_wapper .family_inner ul::after {
clear: both;
content: "";
display: table;
}
@media screen and (max-width: 640px) {
.family_wapper .family_inner ul {
width: 75.6341%;
margin: 0 auto;
}
}
.family_wapper .family_inner ul li {
width: 31.3569%;
float: left;
margin: 0 2.9654% 0 0;
}
@media screen and (max-width: 640px) {
.family_wapper .family_inner ul li {
width: 100%;
margin: 5% 0;
}
}
.family_wapper .family_inner ul li img {
width: 100%;
height: auto;
}
.family_wapper .family_inner ul li p {
font-size: 0.85rem;
font-family: Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" ,  "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" ,  Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
color: #000;
margin: 1% 7%;
}
.family_wapper .family_inner ul li:last-child {
margin: 0 0% 0 0;
}
.family_wapper .bunner_list {
width: 66.6073%;
margin: 2% auto 0 auto;
}
@media screen and (max-width: 640px) {
.family_wapper .bunner_list {
width: 98%;
margin: 5% auto 0 auto;
}
}
.family_wapper .bunner_list img {
width: 100%;
height: auto;
}
#adult {
width: 100%;
margin: 0% 0 4% 0;
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/index/adult_back.png) repeat;
padding: 2% 0 2% 0;
}
#adult ul {
width: 65.825%;
}
@media screen and (max-width: 640px) {
#adult ul {
width: 75.6341%;
margin: 0 auto;
}
}
#adult ul li {
width: 48%;
float: left;
}
#adult ul li:last-child {
float: right;
}
@media screen and (max-width: 640px) {
#adult ul li {
width: 100%;
margin: 5% 0;
float: none;
}
}
#adult ul li img {
width: 100%;
height: auto;
}

html {
box-sizing: border-box; }
*, *::after, *::before {
box-sizing: inherit; }
html {
box-sizing: border-box; }
*, *::after, *::before {
box-sizing: inherit; } .animsition,
.animsition-overlay {
position: relative;
opacity: 0;
-webkit-animation-fill-mode: both;
animation-fill-mode: both; } .animsition-overlay-slide {
position: fixed;
z-index: 1;
width: 100%;
height: 100%;
background-color: #ddd; } .animsition-loading,
.animsition-loading:after {
width: 32px;
height: 32px;
position: fixed;
top: 50%;
left: 50%;
margin-top: -16px;
margin-left: -16px;
border-radius: 50%;
z-index: 100; }
.animsition-loading {
background-color: transparent;
border-top: 5px solid rgba(0, 0, 0, 0.2);
border-right: 5px solid rgba(0, 0, 0, 0.2);
border-bottom: 5px solid rgba(0, 0, 0, 0.2);
border-left: 5px solid #eee;
-webkit-transform: translateZ(0);
transform: translateZ(0);
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-duration: .8s;
animation-duration: .8s;
-webkit-animation-name: animsition-loading;
animation-name: animsition-loading; }
@-webkit-keyframes animsition-loading {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
@keyframes animsition-loading {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg); } }
@-webkit-keyframes fade-in {
0% {
opacity: 0; }
100% {
opacity: 1; } }
@keyframes fade-in {
0% {
opacity: 0; }
100% {
opacity: 1; } }
.fade-in {
-webkit-animation-name: fade-in;
animation-name: fade-in; }
@-webkit-keyframes fade-out {
0% {
opacity: 1; }
100% {
opacity: 0; } }
@keyframes fade-out {
0% {
opacity: 1; }
100% {
opacity: 0; } }
.fade-out {
-webkit-animation-name: fade-out;
animation-name: fade-out; }
@-webkit-keyframes fade-in-up {
0% {
-webkit-transform: translateY(500px);
transform: translateY(500px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
@keyframes fade-in-up {
0% {
-webkit-transform: translateY(500px);
transform: translateY(500px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
.fade-in-up {
-webkit-animation-name: fade-in-up;
animation-name: fade-in-up; }
@-webkit-keyframes fade-out-up {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(-500px);
transform: translateY(-500px);
opacity: 0; } }
@keyframes fade-out-up {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(-500px);
transform: translateY(-500px);
opacity: 0; } }
.fade-out-up {
-webkit-animation-name: fade-out-up;
animation-name: fade-out-up; }
@-webkit-keyframes fade-in-up-sm {
0% {
-webkit-transform: translateY(100px);
transform: translateY(100px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
@keyframes fade-in-up-sm {
0% {
-webkit-transform: translateY(100px);
transform: translateY(100px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
.fade-in-up-sm {
-webkit-animation-name: fade-in-up-sm;
animation-name: fade-in-up-sm; }
@-webkit-keyframes fade-out-up-sm {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(-100px);
transform: translateY(-100px);
opacity: 0; } }
@keyframes fade-out-up-sm {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(-100px);
transform: translateY(-100px);
opacity: 0; } }
.fade-out-up-sm {
-webkit-animation-name: fade-out-up-sm;
animation-name: fade-out-up-sm; }
@-webkit-keyframes fade-in-up-lg {
0% {
-webkit-transform: translateY(1000px);
transform: translateY(1000px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
@keyframes fade-in-up-lg {
0% {
-webkit-transform: translateY(1000px);
transform: translateY(1000px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
.fade-in-up-lg {
-webkit-animation-name: fade-in-up-lg;
animation-name: fade-in-up-lg; }
@-webkit-keyframes fade-out-up-lg {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(-1000px);
transform: translateY(-1000px);
opacity: 0; } }
@keyframes fade-out-up-lg {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(-1000px);
transform: translateY(-1000px);
opacity: 0; } }
.fade-out-up-lg {
-webkit-animation-name: fade-out-up-lg;
animation-name: fade-out-up-lg; }
@-webkit-keyframes fade-in-down {
0% {
-webkit-transform: translateY(-500px);
transform: translateY(-500px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
@keyframes fade-in-down {
0% {
-webkit-transform: translateY(-500px);
transform: translateY(-500px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
.fade-in-down {
-webkit-animation-name: fade-in-down;
animation-name: fade-in-down; }
@-webkit-keyframes fade-out-down {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(500px);
transform: translateY(500px);
opacity: 0; } }
@keyframes fade-out-down {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(500px);
transform: translateY(500px);
opacity: 0; } }
.fade-out-down {
-webkit-animation-name: fade-out-down;
animation-name: fade-out-down; }
@-webkit-keyframes fade-in-down-sm {
0% {
-webkit-transform: translateY(-100px);
transform: translateY(-100px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
@keyframes fade-in-down-sm {
0% {
-webkit-transform: translateY(-100px);
transform: translateY(-100px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
.fade-in-down-sm {
-webkit-animation-name: fade-in-down-sm;
animation-name: fade-in-down-sm; }
@-webkit-keyframes fade-out-down-sm {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(100px);
transform: translateY(100px);
opacity: 0; } }
@keyframes fade-out-down-sm {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(100px);
transform: translateY(100px);
opacity: 0; } }
.fade-out-down-sm {
-webkit-animation-name: fade-out-down-sm;
animation-name: fade-out-down-sm; }
@-webkit-keyframes fade-in-down-lg {
0% {
-webkit-transform: translateY(-1000px);
transform: translateY(-1000px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
@keyframes fade-in-down-lg {
0% {
-webkit-transform: translateY(-1000px);
transform: translateY(-1000px);
opacity: 0; }
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; } }
.fade-in-down-lg {
-webkit-animation-name: fade-in-down;
animation-name: fade-in-down; }
@-webkit-keyframes fade-out-down-lg {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(1000px);
transform: translateY(1000px);
opacity: 0; } }
@keyframes fade-out-down-lg {
0% {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1; }
100% {
-webkit-transform: translateY(1000px);
transform: translateY(1000px);
opacity: 0; } }
.fade-out-down-lg {
-webkit-animation-name: fade-out-down-lg;
animation-name: fade-out-down-lg; }
@-webkit-keyframes fade-in-left {
0% {
-webkit-transform: translateX(-500px);
transform: translateX(-500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
@keyframes fade-in-left {
0% {
-webkit-transform: translateX(-500px);
transform: translateX(-500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
.fade-in-left {
-webkit-animation-name: fade-in-left;
animation-name: fade-in-left; }
@-webkit-keyframes fade-out-left {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(-500px);
transform: translateX(-500px);
opacity: 0; } }
@keyframes fade-out-left {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(-500px);
transform: translateX(-500px);
opacity: 0; } }
.fade-out-left {
-webkit-animation-name: fade-out-left;
animation-name: fade-out-left; }
@-webkit-keyframes fade-in-left-sm {
0% {
-webkit-transform: translateX(-100px);
transform: translateX(-100px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
@keyframes fade-in-left-sm {
0% {
-webkit-transform: translateX(-100px);
transform: translateX(-100px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
.fade-in-left-sm {
-webkit-animation-name: fade-in-left-sm;
animation-name: fade-in-left-sm; }
@-webkit-keyframes fade-out-left-sm {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(-100px);
transform: translateX(-100px);
opacity: 0; } }
@keyframes fade-out-left-sm {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(-100px);
transform: translateX(-100px);
opacity: 0; } }
.fade-out-left-sm {
-webkit-animation-name: fade-out-left-sm;
animation-name: fade-out-left-sm; }
@-webkit-keyframes fade-in-left-lg {
0% {
-webkit-transform: translateX(-1500px);
transform: translateX(-1500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
@keyframes fade-in-left-lg {
0% {
-webkit-transform: translateX(-1500px);
transform: translateX(-1500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
.fade-in-left-lg {
-webkit-animation-name: fade-in-left-lg;
animation-name: fade-in-left-lg; }
@-webkit-keyframes fade-out-left-lg {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(-1500px);
transform: translateX(-1500px);
opacity: 0; } }
@keyframes fade-out-left-lg {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(-1500px);
transform: translateX(-1500px);
opacity: 0; } }
.fade-out-left-lg {
-webkit-animation-name: fade-out-left-lg;
animation-name: fade-out-left-lg; }
@-webkit-keyframes fade-in-right {
0% {
-webkit-transform: translateX(500px);
transform: translateX(500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
@keyframes fade-in-right {
0% {
-webkit-transform: translateX(500px);
transform: translateX(500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
.fade-in-right {
-webkit-animation-name: fade-in-right;
animation-name: fade-in-right; }
@-webkit-keyframes fade-out-right {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(500px);
transform: translateX(500px);
opacity: 0; } }
@keyframes fade-out-right {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(500px);
transform: translateX(500px);
opacity: 0; } }
.fade-out-right {
-webkit-animation-name: fade-out-right;
animation-name: fade-out-right; }
@-webkit-keyframes fade-in-right-sm {
0% {
-webkit-transform: translateX(100px);
transform: translateX(100px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
@keyframes fade-in-right-sm {
0% {
-webkit-transform: translateX(100px);
transform: translateX(100px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
.fade-in-right-sm {
-webkit-animation-name: fade-in-right-sm;
animation-name: fade-in-right-sm; }
@-webkit-keyframes fade-out-right-sm {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(100px);
transform: translateX(100px);
opacity: 0; } }
@keyframes fade-out-right-sm {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(100px);
transform: translateX(100px);
opacity: 0; } }
.fade-out-right-sm {
-webkit-animation-name: fade-out-right-sm;
animation-name: fade-out-right-sm; }
@-webkit-keyframes fade-in-right-lg {
0% {
-webkit-transform: translateX(1500px);
transform: translateX(1500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
@keyframes fade-in-right-lg {
0% {
-webkit-transform: translateX(1500px);
transform: translateX(1500px);
opacity: 0; }
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; } }
.fade-in-right-lg {
-webkit-animation-name: fade-in-right-lg;
animation-name: fade-in-right-lg; }
@-webkit-keyframes fade-out-right-lg {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(1500px);
transform: translateX(1500px);
opacity: 0; } }
@keyframes fade-out-right-lg {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
opacity: 1; }
100% {
-webkit-transform: translateX(1500px);
transform: translateX(1500px);
opacity: 0; } }
.fade-out-right-lg {
-webkit-animation-name: fade-out-right-lg;
animation-name: fade-out-right-lg; }
@-webkit-keyframes rotate-in {
0% {
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; }
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; } }
@keyframes rotate-in {
0% {
-webkit-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; }
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; } }
.rotate-in {
-webkit-animation-name: rotate-in;
animation-name: rotate-in; }
@-webkit-keyframes rotate-out {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; }
100% {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; } }
@keyframes rotate-out {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; }
100% {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; } }
.rotate-out {
-webkit-animation-name: rotate-out;
animation-name: rotate-out; }
@-webkit-keyframes rotate-in-sm {
0% {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; }
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; } }
@keyframes rotate-in-sm {
0% {
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; }
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; } }
.rotate-in-sm {
-webkit-animation-name: rotate-in-sm;
animation-name: rotate-in-sm; }
@-webkit-keyframes rotate-out-sm {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; }
100% {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; } }
@keyframes rotate-out-sm {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; }
100% {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; } }
.rotate-out-sm {
-webkit-animation-name: rotate-out-sm;
animation-name: rotate-out-sm; }
@-webkit-keyframes rotate-in-lg {
0% {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; }
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; } }
@keyframes rotate-in-lg {
0% {
-webkit-transform: rotate(-180deg);
transform: rotate(-180deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; }
100% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; } }
.rotate-in-lg {
-webkit-animation-name: rotate-in-lg;
animation-name: rotate-in-lg; }
@-webkit-keyframes rotate-out-lg {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; }
100% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; } }
@keyframes rotate-out-lg {
0% {
-webkit-transform: rotate(0);
transform: rotate(0);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 1; }
100% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
-webkit-transform-origin: center center;
transform-origin: center center;
opacity: 0; } }
.rotate-out-lg {
-webkit-animation-name: rotate-out-lg;
animation-name: rotate-out-lg; }
@-webkit-keyframes flip-in-x {
0% {
-webkit-transform: perspective(550px) rotateX(90deg);
transform: perspective(550px) rotateX(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(550px) rotateX(0deg);
transform: perspective(550px) rotateX(0deg);
opacity: 1; } }
@keyframes flip-in-x {
0% {
-webkit-transform: perspective(550px) rotateX(90deg);
transform: perspective(550px) rotateX(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(550px) rotateX(0deg);
transform: perspective(550px) rotateX(0deg);
opacity: 1; } }
.flip-in-x {
-webkit-animation-name: flip-in-x;
animation-name: flip-in-x;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-out-x {
0% {
-webkit-transform: perspective(550px) rotateX(0deg);
transform: perspective(550px) rotateX(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(550px) rotateX(90deg);
transform: perspective(550px) rotateX(90deg);
opacity: 0; } }
@keyframes flip-out-x {
0% {
-webkit-transform: perspective(550px) rotateX(0deg);
transform: perspective(550px) rotateX(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(550px) rotateX(90deg);
transform: perspective(550px) rotateX(90deg);
opacity: 0; } }
.flip-out-x {
-webkit-animation-name: flip-out-x;
animation-name: flip-out-x;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-in-x-nr {
0% {
-webkit-transform: perspective(100px) rotateX(90deg);
transform: perspective(100px) rotateX(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(100px) rotateX(0deg);
transform: perspective(100px) rotateX(0deg);
opacity: 1; } }
@keyframes flip-in-x-nr {
0% {
-webkit-transform: perspective(100px) rotateX(90deg);
transform: perspective(100px) rotateX(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(100px) rotateX(0deg);
transform: perspective(100px) rotateX(0deg);
opacity: 1; } }
.flip-in-x-nr {
-webkit-animation-name: flip-in-x-nr;
animation-name: flip-in-x-nr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-out-x-nr {
0% {
-webkit-transform: perspective(100px) rotateX(0deg);
transform: perspective(100px) rotateX(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(100px) rotateX(90deg);
transform: perspective(100px) rotateX(90deg);
opacity: 0; } }
@keyframes flip-out-x-nr {
0% {
-webkit-transform: perspective(100px) rotateX(0deg);
transform: perspective(100px) rotateX(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(100px) rotateX(90deg);
transform: perspective(100px) rotateX(90deg);
opacity: 0; } }
.flip-out-x-nr {
-webkit-animation-name: flip-out-x-nr;
animation-name: flip-out-x-nr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-in-x-fr {
0% {
-webkit-transform: perspective(1000px) rotateX(90deg);
transform: perspective(1000px) rotateX(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(1000px) rotateX(0deg);
transform: perspective(1000px) rotateX(0deg);
opacity: 1; } }
@keyframes flip-in-x-fr {
0% {
-webkit-transform: perspective(1000px) rotateX(90deg);
transform: perspective(1000px) rotateX(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(1000px) rotateX(0deg);
transform: perspective(1000px) rotateX(0deg);
opacity: 1; } }
.flip-in-x-fr {
-webkit-animation-name: flip-in-x-fr;
animation-name: flip-in-x-fr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-out-x-fr {
0% {
-webkit-transform: perspective(1000px) rotateX(0deg);
transform: perspective(1000px) rotateX(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(1000px) rotateX(90deg);
transform: perspective(1000px) rotateX(90deg);
opacity: 0; } }
@keyframes flip-out-x-fr {
0% {
-webkit-transform: perspective(1000px) rotateX(0deg);
transform: perspective(1000px) rotateX(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(1000px) rotateX(90deg);
transform: perspective(1000px) rotateX(90deg);
opacity: 0; } }
.flip-out-x-fr {
-webkit-animation-name: flip-out-x-fr;
animation-name: flip-out-x-fr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-in-y {
0% {
-webkit-transform: perspective(550px) rotateY(90deg);
transform: perspective(550px) rotateY(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(550px) rotateY(0deg);
transform: perspective(550px) rotateY(0deg);
opacity: 1; } }
@keyframes flip-in-y {
0% {
-webkit-transform: perspective(550px) rotateY(90deg);
transform: perspective(550px) rotateY(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(550px) rotateY(0deg);
transform: perspective(550px) rotateY(0deg);
opacity: 1; } }
.flip-in-y {
-webkit-animation-name: flip-in-y;
animation-name: flip-in-y;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-out-y {
0% {
-webkit-transform: perspective(550px) rotateY(0deg);
transform: perspective(550px) rotateY(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(550px) rotateY(90deg);
transform: perspective(550px) rotateY(90deg);
opacity: 0; } }
@keyframes flip-out-y {
0% {
-webkit-transform: perspective(550px) rotateY(0deg);
transform: perspective(550px) rotateY(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(550px) rotateY(90deg);
transform: perspective(550px) rotateY(90deg);
opacity: 0; } }
.flip-out-y {
-webkit-animation-name: flip-out-y;
animation-name: flip-out-y;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-in-y-nr {
0% {
-webkit-transform: perspective(100px) rotateY(90deg);
transform: perspective(100px) rotateY(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(100px) rotateY(0deg);
transform: perspective(100px) rotateY(0deg);
opacity: 1; } }
@keyframes flip-in-y-nr {
0% {
-webkit-transform: perspective(100px) rotateY(90deg);
transform: perspective(100px) rotateY(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(100px) rotateY(0deg);
transform: perspective(100px) rotateY(0deg);
opacity: 1; } }
.flip-in-y-nr {
-webkit-animation-name: flip-in-y-nr;
animation-name: flip-in-y-nr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-out-y-nr {
0% {
-webkit-transform: perspective(100px) rotateY(0deg);
transform: perspective(100px) rotateY(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(100px) rotateY(90deg);
transform: perspective(100px) rotateY(90deg);
opacity: 0; } }
@keyframes flip-out-y-nr {
0% {
-webkit-transform: perspective(100px) rotateY(0deg);
transform: perspective(100px) rotateY(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(100px) rotateY(90deg);
transform: perspective(100px) rotateY(90deg);
opacity: 0; } }
.flip-out-y-nr {
-webkit-animation-name: flip-out-y-nr;
animation-name: flip-out-y-nr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-in-y-fr {
0% {
-webkit-transform: perspective(1000px) rotateY(90deg);
transform: perspective(1000px) rotateY(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(1000px) rotateY(0deg);
transform: perspective(1000px) rotateY(0deg);
opacity: 1; } }
@keyframes flip-in-y-fr {
0% {
-webkit-transform: perspective(1000px) rotateY(90deg);
transform: perspective(1000px) rotateY(90deg);
opacity: 0; }
100% {
-webkit-transform: perspective(1000px) rotateY(0deg);
transform: perspective(1000px) rotateY(0deg);
opacity: 1; } }
.flip-in-y-fr {
-webkit-animation-name: flip-in-y-fr;
animation-name: flip-in-y-fr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes flip-out-y-fr {
0% {
-webkit-transform: perspective(1000px) rotateY(0deg);
transform: perspective(1000px) rotateY(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(1000px) rotateY(90deg);
transform: perspective(1000px) rotateY(90deg);
opacity: 0; } }
@keyframes flip-out-y-fr {
0% {
-webkit-transform: perspective(1000px) rotateY(0deg);
transform: perspective(1000px) rotateY(0deg);
opacity: 1; }
100% {
-webkit-transform: perspective(1000px) rotateY(90deg);
transform: perspective(1000px) rotateY(90deg);
opacity: 0; } }
.flip-out-y-fr {
-webkit-animation-name: flip-out-y-fr;
animation-name: flip-out-y-fr;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important; }
@-webkit-keyframes zoom-in {
0% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
opacity: 0; }
100% {
opacity: 1; } }
@keyframes zoom-in {
0% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
opacity: 0; }
100% {
opacity: 1; } }
.zoom-in {
-webkit-animation-name: zoom-in;
animation-name: zoom-in; }
@-webkit-keyframes zoom-out {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
50% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
opacity: 0; }
100% {
opacity: 0; } }
@keyframes zoom-out {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
50% {
-webkit-transform: scale(0.7);
transform: scale(0.7);
opacity: 0; }
100% {
opacity: 0; } }
.zoom-out {
-webkit-animation-name: zoom-out;
animation-name: zoom-out; }
@-webkit-keyframes zoom-in-sm {
0% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0; }
100% {
opacity: 1; } }
@keyframes zoom-in-sm {
0% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0; }
100% {
opacity: 1; } }
.zoom-in-sm {
-webkit-animation-name: zoom-in-sm;
animation-name: zoom-in-sm; }
@-webkit-keyframes zoom-out-sm {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
50% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0; }
100% {
opacity: 0; } }
@keyframes zoom-out-sm {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
50% {
-webkit-transform: scale(0.95);
transform: scale(0.95);
opacity: 0; }
100% {
opacity: 0; } }
.zoom-out-sm {
-webkit-animation-name: zoom-out-sm;
animation-name: zoom-out-sm; }
@-webkit-keyframes zoom-in-lg {
0% {
-webkit-transform: scale(0.4);
transform: scale(0.4);
opacity: 0; }
100% {
opacity: 1; } }
@keyframes zoom-in-lg {
0% {
-webkit-transform: scale(0.4);
transform: scale(0.4);
opacity: 0; }
100% {
opacity: 1; } }
.zoom-in-lg {
-webkit-animation-name: zoom-in-lg;
animation-name: zoom-in-lg; }
@-webkit-keyframes zoom-out-lg {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
50% {
-webkit-transform: scale(0.4);
transform: scale(0.4);
opacity: 0; }
100% {
opacity: 0; } }
@keyframes zoom-out-lg {
0% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 1; }
50% {
-webkit-transform: scale(0.4);
transform: scale(0.4);
opacity: 0; }
100% {
opacity: 0; } }
.zoom-out-lg {
-webkit-animation-name: zoom-out-lg;
animation-name: zoom-out-lg; }
@-webkit-keyframes overlay-slide-in-top {
0% {
height: 100%; }
100% {
height: 0; } }
@keyframes overlay-slide-in-top {
0% {
height: 100%; }
100% {
height: 0; } }
.overlay-slide-in-top {
top: 0;
height: 0;
-webkit-animation-name: overlay-slide-in-top;
animation-name: overlay-slide-in-top; }
@-webkit-keyframes overlay-slide-out-top {
0% {
height: 0; }
100% {
height: 100%; } }
@keyframes overlay-slide-out-top {
0% {
height: 0; }
100% {
height: 100%; } }
.overlay-slide-out-top {
top: 0;
height: 100%;
-webkit-animation-name: overlay-slide-out-top;
animation-name: overlay-slide-out-top; }
@-webkit-keyframes overlay-slide-in-bottom {
0% {
height: 100%; }
100% {
height: 0; } }
@keyframes overlay-slide-in-bottom {
0% {
height: 100%; }
100% {
height: 0; } }
.overlay-slide-in-bottom {
bottom: 0;
height: 0;
-webkit-animation-name: overlay-slide-in-bottom;
animation-name: overlay-slide-in-bottom; }
@-webkit-keyframes overlay-slide-out-bottom {
0% {
height: 0; }
100% {
height: 100%; } }
@keyframes overlay-slide-out-bottom {
0% {
height: 0; }
100% {
height: 100%; } }
.overlay-slide-out-bottom {
bottom: 0;
height: 100%;
-webkit-animation-name: overlay-slide-out-bottom;
animation-name: overlay-slide-out-bottom; }
@-webkit-keyframes overlay-slide-in-left {
0% {
width: 100%; }
100% {
width: 0; } }
@keyframes overlay-slide-in-left {
0% {
width: 100%; }
100% {
width: 0; } }
.overlay-slide-in-left {
width: 0;
-webkit-animation-name: overlay-slide-in-left;
animation-name: overlay-slide-in-left; }
@-webkit-keyframes overlay-slide-out-left {
0% {
width: 0; }
100% {
width: 100%; } }
@keyframes overlay-slide-out-left {
0% {
width: 0; }
100% {
width: 100%; } }
.overlay-slide-out-left {
left: 0;
width: 100%;
-webkit-animation-name: overlay-slide-out-left;
animation-name: overlay-slide-out-left; }
@-webkit-keyframes overlay-slide-in-right {
0% {
width: 100%; }
100% {
width: 0; } }
@keyframes overlay-slide-in-right {
0% {
width: 100%; }
100% {
width: 0; } }
.overlay-slide-in-right {
right: 0;
width: 0;
-webkit-animation-name: overlay-slide-in-right;
animation-name: overlay-slide-in-right; }
@-webkit-keyframes overlay-slide-out-right {
0% {
width: 0; }
100% {
width: 100%; } }
@keyframes overlay-slide-out-right {
0% {
width: 0; }
100% {
width: 100%; } }
.overlay-slide-out-right {
right: 0;
width: 100%;
-webkit-animation-name: overlay-slide-out-right;
animation-name: overlay-slide-out-right; }
#page_top {
animation: cloak-in 0.75s; }
body {
-webkit-font-smoothing: antialiased; }
.display_flex_center {
display: flex;
justify-content: space-between;
align-items: center; }
.display_flex_stretch {
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
.display_flex_stretch_bottom {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: flex-end; }
.display_flex_center_bottom {
display: flex;
justify-content: space-between;
align-items: center;
align-items: flex-end; }
.display_flex {
display: flex;
flex-wrap: wrap;
justify-content: space-between; }
.display_row {
flex-flow: row wrap; }
body {
font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
color: #323232;
font-weight: 500; }
body img {
width: 100%;
height: auto; }
@media screen and (min-width: 1025px) {
body {
font-size: 16px; } }
@media print, screen and (max-width: 1024px) {
body {
font-size: 1.5625vw; } }
@media screen and (max-width: 768px) {
body {
font-size: 4.26667vw; } }
body input, body textarea, body button {
font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
font-weight: 500; }
@media screen and (min-width: 1025px) {
body input, body textarea, body button {
font-size: 16px; } }
@media print, screen and (max-width: 1024px) {
body input, body textarea, body button {
font-size: 1.5625vw; } }
@media screen and (max-width: 768px) {
body input, body textarea, body button {
font-size: 4.26667vw; } }
body h1, body h2, body h3, body h4, body h5, body h6, body p {
line-height: 1;
font-weight: 500; }
#mintyou, .mintyou {
font-family: 游明朝 ,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS 明朝 E,Meiryo,serif; }
.pc_order_0 {
order: 0; }
@media screen and (max-width: 768px) {
.pc_order_0 {
order: unset; } }
.fw_0 {
font-wieght: 0; }
.pc_order_1 {
order: 1; }
@media screen and (max-width: 768px) {
.pc_order_1 {
order: unset; } }
.fw_100 {
font-wieght: 100; }
.pc_order_2 {
order: 2; }
@media screen and (max-width: 768px) {
.pc_order_2 {
order: unset; } }
.fw_200 {
font-wieght: 200; }
.pc_order_3 {
order: 3; }
@media screen and (max-width: 768px) {
.pc_order_3 {
order: unset; } }
.fw_300 {
font-wieght: 300; }
.pc_order_4 {
order: 4; }
@media screen and (max-width: 768px) {
.pc_order_4 {
order: unset; } }
.fw_400 {
font-wieght: 400; }
.pc_order_5 {
order: 5; }
@media screen and (max-width: 768px) {
.pc_order_5 {
order: unset; } }
.fw_500 {
font-wieght: 500; }
.pc_order_6 {
order: 6; }
@media screen and (max-width: 768px) {
.pc_order_6 {
order: unset; } }
.fw_600 {
font-wieght: 600; }
.pc_order_7 {
order: 7; }
@media screen and (max-width: 768px) {
.pc_order_7 {
order: unset; } }
.fw_700 {
font-wieght: 700; }
.pc_order_8 {
order: 8; }
@media screen and (max-width: 768px) {
.pc_order_8 {
order: unset; } }
.fw_800 {
font-wieght: 800; }
.text_justify {
text-align: justify;
text-justify: inter-ideograph; }
@media screen and (min-width: 1025px) {
.wapper {
width: 1024px;
margin-left: auto;
margin-right: auto; } }
@media print, screen and (max-width: 1024px) {
.wapper {
width: 98%;
margin-left: auto;
margin-right: auto; } }
@media screen and (max-width: 768px) {
.wapper {
width: 100%;
margin-left: auto;
margin-right: auto; } }
.bg_00913A {
background: #00913A; }
.bg_004795 {
background: #004795; }
.page_junior_mini {
display: block;
margin: 5px 0 0 0; }
@media screen and (min-width: 1025px) {
.page_junior_mini {
font-size: 12px; } }
@media print, screen and (max-width: 1024px) {
.page_junior_mini {
font-size: 1.17188vw; } }
@media screen and (max-width: 768px) {
.page_junior_mini {
font-size: 2.8125vw; } }
.add_0408 {
border: none; }
@media screen and (max-width: 768px) {
.add_0408 {
width: 100%;
margin-top: 60px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px; } }
@media screen and (max-width: 768px) and (max-width: 1024px) {
.add_0408 {
margin: 9.37% 0% 0% 0%; } }
.add_0408 img {
display: block; }
.jimnasu_main_cnt {
margin-top: 40px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px; }
@media print, screen and (max-width: 1024px) {
.jimnasu_main_cnt {
margin: 4.3% 0% 0% 0%; } }
.jimnasu_main_cnt .photo_jimnasu_main_cnt {
width: 53.87%; }
.jimnasu_main_cnt .photo_jimnasu_main_cnt img {
max-width: 501px; }
@media screen and (max-width: 768px) {
.jimnasu_main_cnt .photo_jimnasu_main_cnt {
width: 91.18%;
margin-top: 10px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto; } }
@media screen and (max-width: 768px) and (max-width: 1024px) {
.jimnasu_main_cnt .photo_jimnasu_main_cnt {
margin-top: 1.66%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
.jimnasu_main_cnt .sec_jimnasu_main_cnt {
width: 42.13%; }
@media screen and (max-width: 768px) {
.jimnasu_main_cnt .sec_jimnasu_main_cnt {
width: 100%; } }
.add_0408 .jimnasu_main_cnt_txt {
line-height: 1.46154;
color: #EB613B;
font-weight: 600;
text-align: left;
margin-top: -10px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px; }
@media screen and (min-width: 1025px) {
.add_0408 .jimnasu_main_cnt_txt {
font-size: 26px; } }
@media print, screen and (max-width: 1024px) {
.add_0408 .jimnasu_main_cnt_txt {
font-size: 2.53906vw; } }
@media screen and (max-width: 768px) {
.add_0408 .jimnasu_main_cnt_txt {
font-size: 4.6875vw; } }
@media print, screen and (max-width: 1024px) {
.add_0408 .jimnasu_main_cnt_txt {
margin: -2% 0% 0% 0%; } }
.add_0408 .txt_sec_jimnasu_main_cnt {
text-align: left;
line-height: 1.76667; }
@media screen and (min-width: 1025px) {
.add_0408 .txt_sec_jimnasu_main_cnt {
font-size: 15px; } }
@media print, screen and (max-width: 1024px) {
.add_0408 .txt_sec_jimnasu_main_cnt {
font-size: 1.46484vw; } }
@media screen and (max-width: 768px) {
.add_0408 .txt_sec_jimnasu_main_cnt {
font-size: 3.4375vw; } }
@media screen and (max-width: 768px) {
.add_0408 .txt_sec_jimnasu_main_cnt {
margin-top: 10px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px; } }
@media screen and (max-width: 768px) and (max-width: 1024px) {
.add_0408 .txt_sec_jimnasu_main_cnt {
margin: 1.56% 0% 0% 0%; } }
.tokushin_base {
margin-top: 110px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto; }
@media print, screen and (max-width: 1024px) {
.tokushin_base {
margin-top: 11.82%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
.tokushin_base_fx {
margin-top: 55px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto; }
@media print, screen and (max-width: 1024px) {
.tokushin_base_fx {
margin-top: 5.91%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
@media screen and (max-width: 768px) {
.tokushin_base_fx {
margin-top: 35px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
width: 91.01%; } }
@media screen and (max-width: 768px) and (max-width: 1024px) {
.tokushin_base_fx {
margin-top: 5.83%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
.tokushin_base_fx .tokushin_base_fx_box {
width: 27.74%;
color: #FFF;
border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; justify-content: center; }
@media screen and (max-width: 768px) {
.tokushin_base_fx .tokushin_base_fx_box {
width: 100%;
align-items: center;
height: 10.425999999999998vw; } }
.tokushin_base_fx .main_tokushin_base_fx {
width: 69.24%; }
@media screen and (max-width: 768px) {
.tokushin_base_fx .main_tokushin_base_fx {
width: 100%;
margin-top: 20px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto; } }
@media screen and (max-width: 768px) and (max-width: 1024px) {
.tokushin_base_fx .main_tokushin_base_fx {
margin-top: 3.1%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
.tokushin_base_fx_box .h2_tokushin_base_fx_box {
font-weight: 600;
text-align: center; }
@media screen and (min-width: 1025px) {
.tokushin_base_fx_box .h2_tokushin_base_fx_box {
font-size: 35px; } }
@media print, screen and (max-width: 1024px) {
.tokushin_base_fx_box .h2_tokushin_base_fx_box {
font-size: 3.41797vw; } }
@media screen and (max-width: 768px) {
.tokushin_base_fx_box .h2_tokushin_base_fx_box {
font-size: 5.15625vw; } }
@media screen and (max-width: 768px) {
.tokushin_base_fx_box .h2_tokushin_base_fx_box {
display: inline-block; } }
.tokushin_base_fx_box .txt_tokushin_base_fx_box {
margin: 5px 0 0 0;
font-weight: 600;
text-align: center; }
@media screen and (min-width: 1025px) {
.tokushin_base_fx_box .txt_tokushin_base_fx_box {
font-size: 15px; } }
@media print, screen and (max-width: 1024px) {
.tokushin_base_fx_box .txt_tokushin_base_fx_box {
font-size: 1.46484vw; } }
@media screen and (max-width: 768px) {
.tokushin_base_fx_box .txt_tokushin_base_fx_box {
font-size: 2.96875vw; } }
@media screen and (max-width: 768px) {
.tokushin_base_fx_box .txt_tokushin_base_fx_box {
display: inline-block; } }
.main_tokushin_base_fx {
line-height: 1.45313; }
@media screen and (min-width: 1025px) {
.main_tokushin_base_fx {
font-size: 16px; } }
@media print, screen and (max-width: 1024px) {
.main_tokushin_base_fx {
font-size: 1.5625vw; } }
@media screen and (max-width: 768px) {
.main_tokushin_base_fx {
font-size: 3.4375vw; } }
.course_tokushin {
width: 86.88%;
margin-top: 100px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto; }
@media print, screen and (max-width: 1024px) {
.course_tokushin {
margin-top: 10.75%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
@media screen and (max-width: 768px) {
.course_tokushin {
width: 80.24%; } }
.course_tokushin_wap {
margin-top: 50px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
position: relative;
width: 90.09%; }
@media print, screen and (max-width: 1024px) {
.course_tokushin_wap {
margin-top: 6.18%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
.nav_ul_course_tokushin {
width: 65.05%; }
@media screen and (min-width: 1025px) {
.nav_ul_course_tokushin {
font-size: 20px; } }
@media print, screen and (max-width: 1024px) {
.nav_ul_course_tokushin {
font-size: 1.95313vw; } }
@media screen and (max-width: 768px) {
.nav_ul_course_tokushin {
font-size: 3.4375vw; } }
.nav_ul_course_tokushin .li_course_tokushin_wap {
margin-top: 0px;
margin-bottom: 20px;
margin-left: 0px;
margin-right: 0px; }
@media print, screen and (max-width: 1024px) {
.nav_ul_course_tokushin .li_course_tokushin_wap {
margin: 0% 0% 3.8% 0%; } }
.pic_course_tokushin {
position: absolute;
right: 0;
top: -10%;
margin: 0;
width: 13.73%; }
@media screen and (max-width: 768px) {
.pic_course_tokushin {
bottom: 0;
right: 0;
top: unset;
width: 21.08%; } }
.pic_course_tokushin img {
max-width: 100px; }
.add_0408 .appeal_cnt {
margin-top: 65px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
padding-top: 35px;
padding-bottom: 35px;
padding-left: 0px;
padding-right: 0px;
line-height: 1.95;
letter-spacing: 0.006em;
background: url(//kfscz.jp/wp-content/themes/kyotosuiminguschool/img/coaching/appeal_cnt_pc.png) no-repeat center center;
background-size: cover; }
@media print, screen and (max-width: 1024px) {
.add_0408 .appeal_cnt {
margin-top: 6.98%;
margin-bottom: 0%;
margin-left: auto;
margin-right: auto; } }
@media print, screen and (max-width: 1024px) {
.add_0408 .appeal_cnt {
padding: 3.76% 0% 3.76% 0%; } }
@media screen and (min-width: 1025px) {
.add_0408 .appeal_cnt {
font-size: 20px; } }
@media print, screen and (max-width: 1024px) {
.add_0408 .appeal_cnt {
font-size: 1.95313vw; } }
@media screen and (max-width: 768px) {
.add_0408 .appeal_cnt {
font-size: 3.4375vw; } }
.pic_course_tokushin_mat {
margin: 0;
position: absolute;
width: 19.34%;
bottom: -2%;
right: 0; }
@media screen and (max-width: 768px) {
.pic_course_tokushin_mat {
bottom: 0;
right: 0;
top: unset;
width: 40.95%; } }
.pic_course_tokushin_tobibako {
margin: 0;
position: absolute;
width: 11.17%;
bottom: 0%;
right: 0; }
@media screen and (max-width: 768px) {
.pic_course_tokushin_tobibako {
bottom: 0;
right: 0;
top: unset;
width: 26.05%; } }
.nav_ul_course_tetubou {
width: 100%; }
.page_navi .page_navi_junir_ul {
width: 64.9%; }
.page_navi .page_navi_junir_ul li:first-child {
width: 21.41%;
margin: 0 14% 0 0; }
.page_navi .page_navi_junir_ul li:nth-child(2) {
width: 31.89%; }
.page_navi .page_navi_junir_ul li:nth-child(3) {
width: 20.64%; }