@charset "utf-8";

@media (max-width: 1025px) {

  /* =======================================

    1.common.css
    2.header.css
    3.index.php

=========================================*/

 .anchor{
 	padding-top: 68px;
 	margin-top: -68px;
 }
  main {
    padding-top: 62px;
  }

  .sp_menu-container {
    width: 100%;
    margin: 0;
  }

  .sp_menu-contact_box>a {
    display: block;
  }

  .sp_menu-contact_box {
    margin-right: 46px;
    min-width: 8em;
  }

  /* spメニュー用css初期化 */

  .ddmenu li>ul {
    display: block;
    background: none;
    padding: 0 1em 0.4em;
  }

  .ddmenu li ul li {
    border: none;
    padding: 0;
  }

  .ddmenu>li:hover {
    background: none;
    transform: none;
  }

  .ddmenu li:hover ul {
    opacity: 0;
    transition-delay: unset;
  }

  .menu-parent-label {
    display: block;
    text-align: left;
  }

  /*   ナビゲーション表示   */

  #nav-toggle {
    top: 20px;
    position: absolute;
    right: 14px;
    height: 32px;
    cursor: pointer;
    display: block;
  }

  #nav-toggle>div {
    position: relative;
    width: 36px;
    display: block;
  }

  #nav-toggle span {
    position: absolute;
    left: 0;
    display: block;
    width: 100%;
    height: 4px;
    border-radius: 3px;
    -webkit-transition: top .5s ease, -webkit-transform .6s ease-in-out;
    transition: top .5s ease, -webkit-transform .6s ease-in-out;
    transition: transform .6s ease-in-out, top .5s ease;
    transition: transform .6s ease-in-out, top .5s ease, -webkit-transform .6s ease-in-out;
    background: #fff;
    margin-bottom: 10px;
  }

  #nav-toggle span:nth-child(1) {
    top: 0px;
  }

  #nav-toggle span:nth-child(2) {
    top: 14px;
  }

  #nav-toggle span:nth-child(3) {
    top: 28px;
  }
  .open #nav-toggle span {
    background: #ffffff;
  }

  .open #nav-toggle span:nth-child(1) {
    top: 15px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
  }

  .open #nav-toggle span:nth-child(2) {
    top: 15px;
    left: 50%;
    width: 0;
  }

  .open #nav-toggle span:nth-child(3) {
    top: 15px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
  }

  /* z-index */
  #nav-toggle {
    z-index: 1000;
  }

  #gloval-nav {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    display: -webkit-box;
    display: flex;
    flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    align-items: center;
    -webkit-box-align: center;
    z-index: 990;
    visibility: hidden;
    color: #ffffff;
    text-align: center;
    -webkit-transition: opacity .6s ease, visibility .6s ease;
    transition: opacity .6s ease, visibility .6s ease;
    background: #000000;
    opacity: 0;
    width: 300px;
  }

  #gloval-nav a {
    color: #ffffff;
    text-decoration: none;
    font-weight: inherit;
    width: 100%;
    text-align: left;
  }

  #gloval-nav>nav>ul>a:hover {
    color: #666666;
    border: none;
  }

  #gloval-nav>nav>ul {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    list-style: none;
    display: block;
  }

  #gloval-nav>nav>ul li {
    opacity: 0;
  }

  .arrow {
    position: relative;
  }

  .arrow::before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    content: '';
    vertical-align: middle;
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    -webkit-border-radius: 25%;
    border-radius: 25%;
  }

  .arrow::after {
    position: absolute;
    top: 0;
    bottom: 2px;
    margin: auto;
    content: '';
    vertical-align: middle;
    left: 10px;
    box-sizing: border-box;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 10px solid #fff;
  }

  /* open */
  .open {
    overflow: hidden;
  }

  .open #gloval-nav {
    visibility: visible;
    opacity: 1;
  }

  .open #gloval-nav li {
    opacity: 1;
    margin: 0;
    width: 100%;
    /* border-top: 1px solid rgba(255, 255, 255, 0.5); */
  }

  .open #gloval-nav li>ul>li {
    padding: 0;
    /* padding-bottom: 0.4em; */
  }

  /* 子メニューがクリックされた時 */
  #gloval-nav input[type="checkbox"]:checked~.menu-child {
    max-height: inherit;
    overflow-y: visible;
    visibility: visible;
    position: initial;
    opacity: 1;
  }

  .angletoggle:before {
    content: "\f107";
  }


  .close-menu {
	position			: fixed;
	top					: 0;
	left: 0;
	width: calc(100% - 300px);
	height				: 100vh;
	background			: rgba(0,0,0,0);
	cursor				: url(//theorthodoxworks.com/demo/images/cross.svg),auto;
	-webkit-transition-property	: all;
	transition-property			: all;
	-webkit-transition-duration	: .6s;
	transition-duration			: .6s;
	-webkit-transition-delay	: 0s;
	transition-delay			: 0s;
	visibility			: hidden;
	opacity				: 0;
	}

    .open .close-menu {
	-webkit-transition-duration	: .6s;
	transition-duration			: .6s;
	-webkit-transition-delay	: .0s;
	transition-delay			: .0s;
	background			: rgba(0,0,0,.5);
	visibility			: visible;
	opacity				: 1;
	z-index				: 1003;
	}


  /*   NEWS
---------------------------------------- */
  .news_main_box {
    display: block;
  }

  .news_title_text {
    width: 100%;
    display: block;
  }

  .news_main_text {
    display: block;
    margin-bottom: 1em;
  }

  .news_main_box div {
    width: 100%;
  }

  /*   TOP_LESSON
---------------------------------------- */
  .top_lesson_contents_index a {
		width: 75%;
		margin: 0 auto 10px !important;
		display: block;
		}

	.top_lesson_image {
	}
  

  /*   TOP_ABOUT
---------------------------------------- */
  .anchor_course {
    padding-top: 0;
    margin-top: 0;
  }

  .top_about_box {
    flex-wrap: wrap;
  }

  .top_about_image_box {
    width: 100%;
  }

  .top_about_image {
    width: 100%;
  }

  .top_about_contents {
    width: 100%;
  }

  /*   BLOGS
---------------------------------------- */
  .header_category_main {
    margin-top: 95px;
  }

  .header_category button {
    width: 100%;
  }

  .blogs_article_box {
    padding: 1em;
  }

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

  .blogs_image {
    display: block;
  }

  .blogs_post_box {
    display: block;
    padding: 0;
  }

  .wp-post-image {
    width: 100%;
    height: auto;
  }

  .blogs_post_title {
    display: block;
    padding: 1em 0;
  }

  .pager {
    display: flex;
    justify-content: center;
  }

  .page-numbers {
    padding: .5em 1em;
  }

  .blogs_main_title_box {
    display: block;
    padding: 1em .5em;
  }

  .blogs_main_title {
    font-size: 14px;
  }

  .wp-block-image img {
    width: 100%;
    height: auto;
  }

  .top_description_box div {
    width: 100%;
    margin-bottom: 20px;
  }

  .top_sns_image {
    width: 60px;
  }

  /*   ABOUT
---------------------------------------- */
  .about_main_title_box {
    margin-top: 95px;
  }

  .about_main_contents {
    padding: 2em .5em;
  }

  .about_contents_index {
    display: block;
    /* flex-direction: column-reverse; */
  }

  .about_contents_title {
    text-align: center;
  }

  .about_contents_index2{
  	flex-direction:column-reverse;
  	display: flex;
  }

  .about_contents {
    width: 100%;
    padding-bottom: 2em;
  }

  .about_access_index {
    display: block;
    padding: 0 1em;
  }

  .about_main_teachers_box {
    padding: 1em .5em;
  }

  .about_teachers_box {
    display: block;
  }

  .about_teachers {
    width: 100%;
  }

  .about_main_message_text {
    font-size: .9em;
  }


  /*   CLASS
---------------------------------------- */
  .class_main_title_box {
    margin-top: 62px;
  }

  .class_contents_card_box {
    display: block;
  }

  .class_contents_card_index {
    width: 100%;
    margin-bottom: 2em;
  }

  .class_contents_title_box img {
    max-width: 100%;
    max-height: 1.2em;
    height: auto;
  }

  .class_course_box {
    display: block;
    padding: 0.4em;
  }

  .class_course_title_box {
    font-size: 12px;
  }

  .class_price_box {
    padding: .5em;
  }
  /*   お問い合わせ・予約フォーム
---------------------------------------- */
  .contactform_faq_box {
    margin-top: 0;
  }

  .contactform_faq_box ul {
    padding: 4em 1em;
  }

  .cform th,
  .cform td {
    width: 100%;
    display: block;
    border-top: none;
    padding: .3em 0;
  }

	/*  footer  */
	.footer_addres{
		padding-bottom: 1em;
		font-size: 12px;
		margin-right: 0;
	}
}

@media (max-width: 750px){
  .top_pc{
  	display:none;
  }

  .top_sp{
  	display:block;
  }

  .sp_br:before{
	content: "\A" ;
	white-space: pre ;
  }

  .class_price_table tr td {
    /* display: block; */
    font-size: 13px;
    max-width: 6em;
  }

  .class_price_table td:nth-of-type(1){
  	width: 9em;
  }
}

@media (max-width: 500px){
  .side-category {
	/* font-size: x-small; */
	display: block;
	/* font-size: 12px; */
	text-align: center;
	}
}