@charset "UTF-8";
/*
Theme Name: STACK DESIGN
Theme URI: https://stackonline.jp/
Description: STACK ONLINE
Author: Akiyuki Ishihara
Author URI: https://stackonline.jp/
Version: 1.0
*/

body {
 margin: 0;
 color: #333;
}
/* Disable ugly boxes around images in IE10 */
a img{
 border: 0px;
}
::-moz-selection {
 background-color: #333;
 color: #fff;
}
::selection {
 background-color: #333;
 color: #fff;
}
.android-search-box .mdl-textfield__input {
 color: #fff;
}
.android-header .mdl-menu__container {
 z-index: 50;
 margin: 0 !important;
}
.mdl-layout__header-row{
 padding: 0 20px 0 70px;
 box-shadow: 0px 4px 8px -3px rgba(17, 17, 17, .25);
 background: #fff;
}
.mdl-textfield--expandable {
 width: auto;
}
.android-fab {
 position: absolute;
 right: 20%;
 bottom: -26px;
 z-index: 3;
 background: #64ffda !important;
 color: black !important;
}
.android-mobile-title {
 display: none !important;
}
.android-logo-image {
 height: auto;
 max-width: 200px;
}
.android-header {
 overflow: visible;
 background-color: #222;
}
body.page .android-header,body.category .android-header,body.archive .android-header,body.search .android-header{
 background-color: #424242!important;
}
.android-header .material-icons {
 color: #333 !important;
}
.android-header .mdl-layout__drawer-button {
 background: transparent;
 color: #767777;
}

.android-header .mdl-navigation__link {
 color: #333;
 font-size: 14px;
}
ul.mdl-menu a{
 color: #666;
 text-decoration: none;
}
.android-navigation-container {
 /* Simple hack to make the overflow happen to the left instead... */
 direction: rtl;
 -webkit-order: 1;
 -ms-flex-order: 1;
 order: 1;
 width: 500px;
 transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1),
 width 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.android-navigation {
 /* ... and now make sure the content is actually LTR */
 direction: ltr;
 -webkit-justify-content: flex-end;
 -ms-flex-pack: end;
 justify-content: flex-end;
 width: 800px;
}
.android-search-box.is-focused + .android-navigation-container {
 opacity: 0;
 width: 100px;
}
.android-navigation .mdl-navigation__link {
 display: inline-block;
 height: 60px;
 line-height: 60px;
 background-color: transparent !important;
}
.android-search-box {
 -webkit-order: 2;
 -ms-flex-order: 2;
 order: 2;
 margin-left: 16px;
 margin-right: 16px;
}
.android-more-button {
 -webkit-order: 3;
 -ms-flex-order: 3;
 order: 3;		
}
.android-drawer {
 border-right: none;
}
.android-drawer-separator {
 height: 1px;
 background-color: #dcdcdc;
 margin: 8px 0;
}
.android-drawer .mdl-navigation__link.mdl-navigation__link {
 font-size: 14px;
 color: #757575;
}
.android-drawer .mdl-navigation__link.mdl-navigation__link i{
 margin: 0 10px 0 0;
}
.android-drawer span.mdl-navigation__link.mdl-navigation__link {
 color: #8bc34a;
}
.android-drawer .mdl-layout-title {
 position: relative;
 background: #0099ff;
 height: 160px;
}
.android-drawer .android-logo-image {
 position: absolute;
 bottom: 16px;
}
.android-be-together-section {
 position: relative;
 height: 800px;
 width: auto;
 background-color: #f3f3f3;
 background: url('images/slide01.jpg') center 30% no-repeat;
 background-size: cover;
}
.logo-font {
 font-family: 'Roboto', 'Helvetica', 'Arial', sans-serif;
 line-height: 1;
 color: #767777;
 font-weight: 500;
}
.android-slogan {
 font-size: 60px;
 padding-top: 160px;
}
.android-sub-slogan {
 font-size: 21px;
 padding-top: 24px;
}
.android-create-character {
 font-size: 21px;
 padding-top: 400px;
}
.android-create-character a {
 text-decoration: none;
 color: #767777;
 font-weight: 300;
}
.android-screen-section {
 position: relative;
 padding-top: 60px;
 padding-bottom: 80px;
}
.android-screens {
 text-align: right;
 width: 100%;
 white-space: nowrap;
 overflow-x: auto;
}
.android-screen {
 text-align: center;
}
.android-screen .android-link {
 margin-top: 16px;
 display: block;
 z-index: 2;
}
.android-image-link {
 text-decoration: none;
}
.android-wear {
 display: inline-block;
 width: 160px;
 margin-right: 32px;
}
.android-wear .android-screen-image {
 width: 40%;
 z-index: 1;
}
.android-phone {
 display: inline-block;
 width: 64px;
 margin-right: 48px;
}
.android-phone .android-screen-image {
 width: 100%;
 z-index: 1;
}
.android-tablet {
 display: inline-block;
 width: 110px;
 margin-right: 64px;
}
.android-tablet .android-screen-image {
 width: 100%;
 z-index: 1;
}
.android-tablet .android-link {
 display: block;
 z-index: 2;
}
.android-tv {
 display: inline-block;
 width: 300px;
 margin-right: 80px;
}
.android-tv .android-screen-image {
 width: 100%;
 z-index: 1;
}
.android-auto {
 display: inline-block;
 width: 300px;
 overflow: hidden;
}
.android-auto .android-screen-image {
 display: block;
 height: 300px;
 z-index: 1;
}
.android-wear-section {
 position: relative;
 background: url('images/wear.png') center top no-repeat;
 background-size: cover;
 height: 800px;
}
.android-wear-band {
 position: absolute;
 bottom: 0;
 width: 100%;
 text-align: center;
 background-color: #37474f;
}
.android-wear-band-text {
 max-width: 800px;
 margin-left: 25%;
 padding: 24px;
 text-align: left;
 color: white;
}
.android-wear-band-text p {
 padding-top: 8px;
}
.android-link {
 text-decoration: none;
 color: #8bc34a !important;
}
.android-link:hover {
 color: #7cb342 !important;
}
.android-link .material-icons {
 position: relative;
 top: -1px;
 vertical-align: middle;
} 
.android-alt-link {
 text-decoration: none;
 color: #64ffda !important;
 font-size: 16px;
}
.android-alt-link:hover {
 color: #00bfa5 !important;
}
.android-alt-link .material-icons {
 position: relative;
 top: 6px;
}
.android-customized-section {
 text-align: center;
}
.android-customized-section-text {
 max-width: 500px;
 margin-left: auto;
 margin-right: auto;
 padding: 80px 16px 0 16px;
}
.android-customized-section-text p {
 padding-top: 16px;
}
.android-customized-section-image {
 background: url('images/devices.jpg') center top no-repeat;
 background-size: cover;
 height: 400px;
}
.android-more-section {
 padding: 80px 0;
 max-width: 1044px;
 margin-left: auto;
 margin-right: auto;
}
.android-more-section .android-section-title {
 margin-left: 12px;
 padding-bottom: 24px;
}
.android-card-container .mdl-card__media {
 overflow: hidden;
 background: transparent;
}
.android-card-container .mdl-card__media img {
 width: 100%;
}
.android-card-container .mdl-card__title {
 background: transparent;
 height: auto;
}
.android-card-container .mdl-card__title-text {
 color: black;
 height: auto;
}
.android-card-container .mdl-card__supporting-text {
 height: auto;
 color: black;
 padding-bottom: 56px;
}
.android-card-container .mdl-card__actions {
 position: absolute;
 bottom: 0;
}
.android-card-container .mdl-card__actions a {
 border-top: none;
 font-size: 16px;
}
.android-footer {
 background-color: #fafafa;
 position: relative;
}
.mdl-mega-footer{
 background: #555;
}
.android-footer a:hover {
 color: #8bc34a;
}
.android-footer .mdl-mega-footer--top-section::after {
 border-bottom: none;
}
.android-footer .mdl-mega-footer--middle-section::after {
 border-bottom: none;
}
.android-footer .mdl-mega-footer--bottom-section {
 position: relative;
}
.android-footer .mdl-mega-footer--bottom-section a {
 margin-right: 2em;
}
.android-footer .mdl-mega-footer--right-section a .material-icons {
 position: relative;
 top: 6px;
}
.android-link-menu:hover {
 cursor: pointer;
}
footer a{
 color: #0099ff;
 text-decoration: none;
}
footer a:hover{
 color: #999;
}
footer ul{
 display: flex;
 justify-content: center;
}
footer ul li{
 list-style: none;
 margin: 0 20px 0 0;
}
.mdl-grid{
 padding: 0;
}
img.sidelogo{
 margin: 30px 0 0 0;
}
.mdl-layout__drawer .mdl-navigation{
 padding-top: 0;
 max-width: 500px;
}
.android-drawer p.username{
 color: #fff;
 margin: 20px 20px 0 0;
 line-height: 1.5;
}

/*pagenav area css--------------------------------------*/
.pager{
 width: 100%;
 text-align:center;
 margin: 20px 0 30px 0;
}
.wp-pagenavi {
 margin: 20px auto 0px;
 display: inline-block;
}
.wp-pagenavi a {
 background: #fff none repeat scroll 0 0;
 border-color: #333;
 border-style: solid;
 border-width: 1px;
 color: #000;
 float: left;
 font-family: Arial,Helvetica,sans-serif;
 font-size: 14px;
 font-weight: bold;
 margin: 0 4px;
 padding: 8px 15px;
 text-decoration: none;
}
.wp-pagenavi a:hover {
 background: #0099FF none repeat scroll 0 0;
 border-color: #0099FF;
 border-style: solid;
 border-width: 1px;
 color: #fff;
 float: left;
 font-family: Arial,Helvetica,sans-serif;
 font-size: 14px;
 font-weight: bold;
 margin: 0 4px;
 padding: 8px 15px;
 text-decoration: none;
}
.wp-pagenavi span.pages {
 background: #fff none repeat scroll 0 0;
 border-color: #333;
 border-style: solid;
 border-width: 1px;
 color: #000;
 float: left;
 font-family: Arial,Helvetica,sans-serif;
 font-size: 14px;
 font-weight: bold;
 margin: 0 4px;
 padding: 8px 15px;
 text-decoration: none;
}
.wp-pagenavi span.current {
 background: #333 none repeat scroll 0 0;
 border-color: #333;
 border-style: solid;
 border-width: 1px;
 color: #fbf8f5;
 float: left;
 font-family: Arial,Helvetica,sans-serif;
 font-size: 14px;
 font-weight: bold;
 margin: 0 4px;
 padding: 8px 15px;
 text-decoration: none;
}

/*lp area*/
img.sp-img{
 margin: -15px 0 10px 0;
}
body.page-id-22{
 background: #0099ff;
}
.lp{
 max-width: 1200px;
}
.lp h1{
 font-size: 1.66rem;
 color: #444;
 margin: 0 0 0 5px;
 border-bottom: 2px solid #e1e1e1;
 padding-bottom: 5px;
 line-height: 1.6;
 text-align: left;
 font-weight: bold;
}
.lp ul li{
 font-size: 14px;
 line-height: 2.4;
 list-style: none;
 color: #555;
}
.lp ul li i{
 font-size: 20px;
 vertical-align:top;
 margin: 8px 5px 0 0;
 color: #29AC27;
}
.lp ul{
 border: 1px solid #e5e5e5;
 padding: 20px 10px 0 25px;
 background: #f8f8f8;
}
.facebook{
 width: 100%;
 height: 50px;
 padding: 20px 0 0 20px;
 text-align: center;
}
.entry{
 width: 89%;
 text-align: center;
 padding-bottom: 20px;
 margin: 0 0 20px 0;
}
.entry p.privacypolicy{
 margin: 0 0 0 50px;
}
.entry p.privacypolicy a{
 color: #666;
}
.entry p.privacypolicy a:hover{
 color: #0099FF;
}
.main-lp{
 background: #000;
 margin: 0 auto 15px;
 width: 102%;
}
.main-lp a{
 color: #fff!important;
}
#main-bg{
 background:url(images/main_bg.jpg) no-repeat;
 background-size: cover;
}
.mdl-mega-footer{
 text-align:center;
}
.mdl-mega-footer a{
 color: #fff;
}
#wpmem_reg legend, #wpmem_login legend{
 display: none;
}
#wpmem_login fieldset{
 color: #fff;
}
#wpmem_login fieldset input.buttons{
 border: 1px solid #999;
 border-radius: 5px;
}
#wpmem_login fieldset a{
 color: #fff!important;
}
#wpmem_login .link-text{
 font-size: 15px;
}
#wpmem_msg h2{
 font-size: 18px;
 color: #fff;
}
#wpmem_msg p{
 color: #fff;
}
#wpmem_login .username{
 width: 100%;
 padding: 10px;
 margin: 0 0 20px 0;
 border: 0;
 border-radius: 2px;
}
#wpmem_login .password{
 width: 100%;
 padding: 10px;
 margin: 0 0 20px 0;
 border: 0;
 border-radius: 2px;
}
#wpmem_login label{
 margin: 7px 0 0 0;
}
/*logout*/
p.logout{
 color: #fff;
 margin: 10px 0 0 40px;
}
span.trial{
 font-weight: bold;
 color: #96f35e;
 border: 2px solid #96f35e;
 margin: 0 auto;
 padding: 15px;
 font-size: 1.2rem;
 display: block;
 width: fit-content;
}
/* main-title */
.main-title{
 width: 100%;
 height: 460px;
 background: url("images/main_bg.jpg") no-repeat;
 background-size: cover;
 display: flex;
 justify-content: center;
 align-items: center;
}
.main-logo img{
 max-width: 800px;
 height: auto;
}
/*pagetop*/
footer .mdl-button{
 color: #fff;
}
/* user_name css */
.user_name{
 width: 100%;
 height: 40px;
 line-height: 40px;
 background: #e7e7e7;
 margin: 0;
 text-align: center;
}
.user_name p{
 font-size: 0.9rem;
 padding: 8px 0 0 0;
 margin: 0 auto;
}
.home-contents{
 max-width: 1150px;
 height: fit-content;
 margin: 50px auto;
}
.single-contents{
 max-width: 900px;
 height: fit-content;
 margin: 0 auto;
 text-align: center;
}
img.avatar-85{
 width: 100%;
 height: auto;
}
body.page-id-9 .home-contents{
 max-width: 800px;
}
.main-contents{
 max-width: 1200px;
 margin: 20px auto;
 display: flex;
 justify-content: space-between;
}
.main-contents .main-contents-left{
 width: 60%;
}
.main-contents .main-contents-left img{
 width: 100%;
 height: auto;
 margin: 0 0 20px 0;
}
.main-contents .main-contents-left h1{
 font-size: 1.6rem;
 font-weight: bold;
 border-bottom: 4px solid #3366cc;
 padding: 0 0 5px 0;
}
.main-contents .main-contents-left .join h2{
 font-size: 1rem;
 font-weight: bold;
 background: #eff28f;
 display: inline-block;
 padding: 0px 14px;
 letter-spacing: 0.1em;
 position: absolute;
 margin: -23px 0 0 300px;
 z-index: 10;
}
b{
 color: #c00000;
 font-weight: bold;
}
.main-contents .main-contents-left ul{
 border: 2px solid #D4D4D4;
 padding: 60px 40px 40px 60px;
 font-size: 1rem;
 position: relative;
 z-index: 0;
 margin: 60px 0 0 0;
 border-radius: 5px;
 letter-spacing: 0.05em;
}
.main-contents .main-contents-left ul li{
 line-height: 2.5;
 font-weight: bold;
}
.main-contents .main-contents-left ul li span{
 vertical-align: top;
 margin: 9px 7px 0 0;
 font-size: 1.2rem;
}
.main-contents .main-contents-left p{
 font-size: 1rem;
 font-weight: bold;
 line-height: 1.6;
 letter-spacing: 0.05em;
}
.main-contents .main-contents-left p:first-of-type{
 margin: 30px 0 20px 0;
}
.main-contents .main-contents-right{
 width: 32%;
}
.main-contents .main-contents-right img{
 width: 100%;
 height: auto;
 margin: 30px 0 0 0;
}
.main-contents .main-contents-right p.join-detail{
 border-bottom: 1px solid #ccc;
 padding: 0 0 14px 0;
}
.main-contents .main-contents-right .join-entry{
 border: 2px solid #2070b8;
 border-radius: 5px;
 margin: 15px 0 0 0;
}
.main-contents .main-contents-right .join-entry h3{
 color: #fff;
 background: #2070b8;
 margin: 0;
 font-size: 1.2rem;
 font-weight: bold;
 line-height: 1.5;
 padding: 20px;
 text-align: center;
}
.main-contents .main-contents-right .join-entry .join-form{
 padding: 20px 20px 0px 20px;
}
.main-contents .main-contents-right .join-entry .join-form p{
 line-height: 1.5;
}
span.red{
 color: #BD0003;
 margin: 0 5px 0 0;
}
span.small{
 font-size: 0.8rem;
 margin: 0 0 0 7px;
}
ul.name{
 display: flex;
 justify-content: left;
 padding: 0;
 margin: -11px 0 0 0;
}
ul.name li{
 list-style: none;
}
ul.name li input{
 width: 78%;
 padding: 10px;
}
label{
 display: block;
}
select{
 width: 200px;
 padding: 10px;
 margin: -11px 0 0 0;
}
textarea{
margin: -11px 0 0 0;
    width: 93%;
    padding: 10px;
}

input,textarea,select{
 background: #fff8df;
 border: 1px solid #999999;
 border-radius: 3px;
}
textarea{
 margin: 20px 0 0 0;
}
.main-contents .main-contents-right input.wpcf7-email{
padding: 10px;
display: block;
margin: -7px 0 0 0;
}
input.wpcf7-submit{
 background: #45b168;
 color: #fff;
 width: 100%;
 border: 0;
 padding: 20px;
 font-size: 1.3rem;
 font-weight: bold;
 border-radius: 7px;
 transition: 0.3s;
 cursor: pointer;
}
input.wpcf7-submit:hover{
 background: #388f54;
 transition: 0.3s;
}
.curriculum{
 max-width: 1200px;
 margin: 60px auto;
 text-align: center;
}
.curriculum h4{
 font-size: 2rem;
 font-weight: bold;
 margin: 30px 0 0 0;
}
.curriculum p{
 font-size: 1.5rem;
 font-weight: bold;
 margin: 15px 0 0 0;
 padding: 15px 20px;
 border: 2px solid #333;
 display: inline-block;
}
.curriculum p.curriculum-detail{
 font-size: 1rem;
 border: none;
 margin: 10px;
 padding: 0;
}
.curriculum img{
width: 100%;
height: auto;
}
.curriculum span{
 font-size: 2.3rem;
 vertical-align: top;
 margin: -1px 5px 0 0;
 color: #0066CC;
}

/* teacher info */
.teacher-info{
 max-width: 1200px;
 margin: 0 auto;
 text-align: center;
}
.teacher-info img{
 image-rendering: -webkit-optimize-contrast;
 width: 60%;
 height: auto;
 margin: 35px 0 0 0;
}
.teacher-info h3{
 font-size: 1.2rem;
 font-weight: bold;
 line-height: 1.5;
 margin: 40px 0 20px 0;
 text-align: center;
}
.teacher-info h3 span{
 font-size: 0.9rem;
 display: block;
}
.teacher-info h3 span.name{
 display: contents;
 font-size: 0.9rem;
 margin: 0 0 0 10px;
}
.teacher-info p{
 text-align: left;
 font-size: 1rem;
 line-height: 1.7;
 margin: 0 0 15px 0;
}
.teacher-info .introduce{
 padding: 35px 20px 20px 20px;
 border: 2px solid #ddd;
 max-width: 43%;
 margin: 20px 40px 0 0;
 position: relative;
 border-radius: 5px;
}
.teacher-info .introduce span.teacher-tag{
 position: absolute;
 left: -10px;
 top: -10px;
 background: #ecf07a;
 padding: 7px 15px;
 font-size: 0.8rem;
 font-weight: bold;
 border-radius: 2px;
}
.teacher-info .message{
 padding: 35px 20px 20px 20px;
 border: 2px solid #ddd;
 max-width: 650px;
 margin: 20px 40px 0 0;
 position: relative;
 border-radius: 5px;
}
.teacher-info .message span.teacher-tag{
 position: absolute;
 left: -10px;
 top: -10px;
 background: #ecf07a;
 padding: 7px 15px;
 font-size: 0.9rem;
 font-weight: bold;
 border-radius: 2px;
}
.all-button-youtube a:hover{
 background: #990000;
 transition: 0.3s;
 cursor: pointer;
 color: #fff;
}
.all-button-youtube a{
 transition: 0.3s;
 display: block;
 width: 210px;
 height: fit-content;
 text-decoration: none;
 text-align: center;
 color: #990000;
 font-weight: bold;
 cursor: pointer;
 border: 3px solid #990000;
 background: #fff;
 margin: 30px auto 40px;
 border-radius: 100px;
 padding: 15px 20px;
 font-size: 1.2rem;
}
.all-button-entry a:hover{
 background: #388f54;
 transition: 0.3s;
 cursor: pointer;
 color: #fff;
}
.all-button-entry a{
 transition: 0.3s;
 display: block;
 width: 350px;
 height: fit-content;
 text-decoration: none;
 text-align: center;
 color: #fff;
 font-weight: bold;
 cursor: pointer;
 background: #45b168;
 margin: 30px auto 40px;
 border-radius: 100px;
 padding: 15px 20px;
 font-size: 1.2rem;
}
.mdl-layout__header-row .mdl-navigation{
 width: 1000px;
}
.mdl-button--accent.mdl-button--accent.mdl-button--raised, .mdl-button--accent.mdl-button--accent.mdl-button--fab {
 color: #fff;
 background-color: #45b168;
}
.mdl-button--accent.mdl-button--accent.mdl-button--raised:hover, .mdl-button--accent.mdl-button--accent.mdl-button--fab:hover {
 color: #fff;
 background-color: #388f54;
}
.android-navigation .mdl-navigation__link:hover{
 border-bottom: 1px solid #fff;
}
.privacypolicy-main{
 width: 100%;
 height: 400px;
 background: url("images/company_bg.jpg") no-repeat;
 display: flex;
 align-items: center;
 justify-content: center;
 background-size: cover;
}
.privacypolicy-main h1{
 color: #fff;
 font-weight: bold;
 font-size: 2rem;
 letter-spacing: 0.05em;
 text-align: center;
}
.privacypolicy-main h1 span{
 display: block;
 font-size: 0.9rem;
 opacity: 0.6;
}
.company-main{
 width: 100%;
 height: 400px;
 background: url("images/company-bg.jpg") no-repeat;
 display: flex;
 align-items: center;
 justify-content: center;
 background-size: cover;
}
.company-main h1{
 color: #fff;
 font-weight: bold;
 font-size: 2rem;
 letter-spacing: 0.05em;
 text-align: center;
}
.company-main h1 span{
 display: block;
 font-size: 0.9rem;
 opacity: 0.6;
}
.company-info{
 max-width: 800px;
 margin: 28px auto;
}
.company-info a{
 color: #0066CC;
}
.company-info table{
 font-size: 0.9rem;
 line-height: 1.5;
}
.company-info table,.company-info td,.company-info tr{
 border: 1px solid #eee;
 padding: 10px;
 vertical-align: center;
}
.company-info td.grey{
 background: #f7f7f7;
}
.company-info h2{
 font-size: 1.6rem;
 font-weight: bold;
}
.mdl-layout__drawer .mdl-navigation .mdl-navigation__link{
 padding: 16px 30px;	
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
 background: #ff3d00;
 color: #fff;
 border-radius: 6px;
 border: 0;
 padding: 10px 20px;
}

/* thanks */
.company-main{
 width: 100%;
 height: 700px;
 background: url("images/company_bg.jpg") no-repeat;
 background-size: 100% auto;
 display: flex;
 justify-content: center;
 align-items: center;
}
.company-main h2{
 color: #fff;
 font-size: 2rem;
 font-weight: bold;
}
.company-info{
 max-width: 800px;
 margin: 28px auto;
}
.company-info table{
 font-size: 0.9rem;
 line-height: 1.5;
}
h3 span {
 display: block;
 line-height: 1.8;
 font-size: 1rem;
}
.company-info table,.company-info td,.company-info tr{
 border: 1px solid #eee;
 padding: 10px;
 vertical-align: center;
}
.company-info td.grey{
 background: #f7f7f7;
}
.thanks-main{
 width: 100%;
 height: 400px;
 background: url("images/company_bg.jpg") no-repeat;
 background-size: 100% auto;
 display: flex;
 justify-content: center;
 align-items: center;
}
.thanks-main h2{
 color: #fff;
 font-size: 2rem;
 font-weight: bold;
}
.thanks{
 max-width: 800px;
 margin: 28px auto 100px;
 text-align: center;
}
.thanks img{
 max-width: 160px;
 height: auto;
}
body.page .thanks p{
 text-align: left;
 font-size: 1.1rem;
 max-width: 600px;
 margin: 25px auto;
}
.teacher-message{
 display: flex;
 max-width: 1200px;
 justify-content: space-between;
}
.teacher-info .introduce a{
	color: #0066CC;
}
span.yellow{
 background: #eff28f;
}
.portforio{
max-width: 800px;
margin: 0 auto;
}
.portforio p{
	font-size: 1.2rem;
}
.portforio h2{
 font-size: 1.6rem;
 font-weight: bold;
 line-height: 1.5;
}
#wpcf7cpcnf table,#wpcf7cpcnf tr,#wpcf7cpcnf td{
 border: 1px solid #ddd;
 border-collapse: collapse;
}
#wpcf7cpcnf table th{
 border: none;
 display: none;
}
#wpcf7cpcnf td{
 border-left: none;
 padding: 10px;
}
#wpcf7cpcnf table{
	 width: 100%;
    background: #f7f7f7;
}
button.wpcf7cp-cfm-edit-btn {
    margin-right: 20px;
    margin-bottom: 20px;
    background: #dbdbdb;
    border: 0;
    padding: 10px 30px;
    border-radius: 5px;
}
button.wpcf7cp-cfm-submit-btn {
    margin-bottom: 20px;
    border: 0;
    padding: 10px 30px;
    border-radius: 5px;
    background: #45B168;
    color: #fff;
}
div#wpcf7cpcnf p{
	margin: 0;
}
.faq{
 max-width: 800px;
 margin: 0 auto;
}
#sp-ea-119.sp-easy-accordion>.sp-ea-single>.ea-header a{
 font-size: 1.1rem;
}
.faq h2{
	    font-size: 2rem;
    text-align: center;
    font-weight: bold;
	margin: 60px 0 20px 0;
}
.sp-easy-accordion a{
 color: #0066CC;
}
.sp-ea-one.sp-easy-accordion .sp-ea-single .ea-header a {
    padding: 7px 10px;
}


/* mobile media query --------------------------------------------------------------------- */
@media(min-width: 441px){
footer .mdl-button{
 float: right;
 margin: -32px 0 0 0;
}
.main-title-sp{
 display: none;
}
}
@media(min-width: 768px){
}
@media(min-width: 1024px){	
}

@media(max-width: 1280px){
	.company-main{
		height: 350px;
	}
 .main-contents {
    max-width: 90%;
}
}


@media(max-width: 1024px){

.teacher-message{
 display: flex;
}
.teacher-message {
 max-width: 90%;
 margin: 0 auto;
}
.teacher-info .message{
 margin: 20px 0px 0 0;
}
.curriculum{
 max-width: 90%;
}
.main-contents{
 display: block;
 padding: 0 40px;
}
ul.name li input {
 width: 85%;
}
.main-contents .main-contents-right img{
 width: 70%;
}
.main-contents .main-contents-right{
 text-align: center;
}
.main-contents .main-contents-right .join-entry .join-form{
 text-align: left;
}
.main-contents .main-contents-left .join h2{
 margin: -23px 0 0 390px;
}
.main-contents .main-contents-left {
 width: 100%;
}
.main-contents .main-contents-right {
 width: 100%;
}
body.page .home-contents {
    max-width: 90%;
}
.main-area {
 width: 100%;
 height: 250px;
}
.mdl-layout__header-row{
 padding: 0;
}
.android-logo-image {
 margin: -2px 0 0 54px;
}
.android-more-button{
 right: 10px;
}
}
@media (max-width: 900px) {
.android-navigation-container {
 display: none;
}
.android-title {
 display: none !important;
}
.android-mobile-title {
 display: block !important;
 position: absolute;
 left: calc(50% - 70px);
 top: 12px;
 transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
  /* WebViews in iOS 9 break the "~" operator, and WebViews in OS X 10.10 break
     consecutive "+" operators in some cases. Therefore, we need to use both
     here to cover all the bases. */
.android.android-search-box.is-focused ~ .android-mobile-title,
.android-search-box.is-focused + .android-navigation-container + .android-mobile-title {
 opacity: 0;
}
.android-more-button {
 display: none;
}
.android-search-box.is-focused {
 width: calc(100% - 48px);
}
.android-search-box .mdl-textfield__expandable-holder {
 width: 100%;
}
.android-be-together-section {
 height: 350px;
}
.android-slogan {
 font-size: 26px;
 margin: 0 16px;
 padding-top: 24px;
}
.android-sub-slogan {
 font-size: 16px;
 margin: 0 16px;
 padding-top: 8px;
}
.android-create-character {
 padding-top: 200px;
 font-size: 16px;
}
.android-create-character img {
 height: 12px;
}
.android-fab {
 display: none;
}
.android-wear-band-text {
 margin-left: 0;
 padding: 16px;
}
.android-footer .mdl-mega-footer--bottom-section{
 display: none;
}
.entry select{
 border: 1px solid #999;
}
}
@media(min-width: 768px) and (max-width: 1024px){
.cat-article{
 padding: 10px 10px 0 10px;
}
body.single .related-post,body.single .related-post:first-of-type{
 width: 55%;
 margin: 0 auto;
}
}
@media(max-width: 820px){
 .company-main {
 height: 260px;
}
.android-logo-image {
 margin: 5px 0 0 -30px;
}
.company-info{
 max-width: 90%;
}
.main-contents .main-contents-left .join h2 {
 margin: -23px 0 0 290px;
}
}
@media(max-width: 768px){
.portforio{
	max-width: 90%;
}
    .teacher-message {
        display: block;
    }
.teacher-info .introduce{
 margin: 20px 0px 0 0;
 max-width: 100%;
}
.main-contents .main-contents-left h1{
 font-size: 1.9rem;
}	
.main-contents .main-contents-left .join h2 {
 margin: -23px 0 0 270px;
}
.main{
 height: 270px;
}
.main img{
 width: 273px;
 height: 125px;
 padding-top: 70px;
}
.android-logo-image {
 margin: 8px 0 0 -13%;
}
.mdl-textfield--full-width{
 width: 250px!important;
}
.mdl-mega-footer--link-list li, .mdl-mega-footer__link-list li{
 line-height: 2.1;
}
.android-header .mdl-layout__drawer-button {
 margin: 3px 0 0 3px;
}
.mdl-textfield--expandable .mdl-button--icon{
 top: 20px;
 right: -5px;
}
.demo-card-square.mdl-card{
 height: 315px;
}
}

@media(max-width: 440px){
.faq {
 max-width: 93%;
}
	.all-button-entry a{
	width: 310px;
	}
	.privacypolicy-main{
		    background: url(images/company_bg.jpg) no-repeat -130px 0px;
		background-size: cover;
	}
	.company-main {
		height: 130px;
		}
.curriculum p.curriculum-detail{
	font-size: 0.9rem;
}
.teacher-message {
 max-width: 100%;
}
.curriculum p {
 font-size: 1.3rem;
}
.teacher-info .introduce span.teacher-tag {
 left: -5px;
 top: -5px;
}
.teacher-info .introduce{
 margin: 30px 15px;
 max-width: 100%;
}
.teacher-info .message span.teacher-tag {
 left: -5px;
 top: -5px;
}
.teacher-info .message{
 margin: 30px 15px;
}
.teacher-info img{
 width: 90%;
}
.curriculum .flow-box{
 display: flex;
 overflow-x: scroll;
}
.curriculum .flow-box img{
flex-shrink: 0;
width: 1500px;
}
.curriculum h4 {
 font-size: 1.5rem;
}
.main-contents .main-contents-left ul li span{
 margin: 4px 6px 0 0;
}
.main-contents .main-contents-left ul li {
 line-height: 1.5;
 margin: 0 0 20px 0;
 margin-left: 1.4em;
　text-indent: -1.4em;
}
.main-contents .main-contents-right .join-entry .join-form {
 padding: 20px 20px 0 20px;
}
ul.name li input {
 width: 78%;
}
.main-contents .main-contents-right img {
 width: 100%;
}
.main-contents .main-contents-left ul{
 padding: 40px 20px 20px 20px;
}
.main-contents .main-contents-left .join h2{
 margin: -23px 0 0 125px;
}
.main-contents .main-contents-left h1 {
 font-size: 1.7rem;
}
.main-contents {
 display: block;
 padding: 0 15px;
}
body.page .page-contents{
}
.main-title{
 display: none;
}
.main-title-sp{
 width: 100%;
 height: fit-content;
 position: relative;
 z-index: 0;
 text-align: center;
}
.main-title-sp img{
 max-width: 100%;
 height: auto;
}
.main-title-sp .all-button{
 position: absolute;
 z-index: 100;
 width: 300px;
 height: 30px;
 border-radius: 100px;
 text-align: center;
 padding: 20px 0;
 margin: -140px auto 60px;
 background: #2d9a25;
 transition: 0.3s;
 font-size: 21px;
 font-weight: bold;
 display: inline-block;
}
.main-title-sp .all-button:hover{
 background: #2d9a25;
 transition: 0.3s;
 cursor: pointer;
}
.main-title-sp .all-button a{
 display: block;
 width: 100%;
 height: 100%;
 text-decoration: none;
 color: #FFF;
 cursor: pointer;
}
.button-sp{
 display: flex;
 justify-content: center;
 align-items: center;
}
}
@media(max-width: 393px){
.main-contents .main-contents-left .join h2 {
 margin: -23px 0 0 105px;
}
}
@media(max-width: 375px){
.curriculum p {
 font-size: 1.4rem;
}
.user_name{
 margin: 0;	
}
}

@media(max-width: 320px){
.main-contents .main-contents-right input.wpcf7-email{
 width: 90%;
}
.main-contents .main-contents-left .join h2 {
 margin: -23px 0 0 80px;
}
.main-title-sp .all-button{
 position: absolute;
 z-index: 100;
 width: 239px;
 height: fit-content;
 border-radius: 100px;
 text-align: center;
 padding: 10px 0;
 margin: -120px auto 60px;
 background: #2d9a25;
 transition: 0.3s;
 font-size: 18px;
 font-weight: bold;
 display: inline-block;
}
}