/* ------ スマートフォン横 ------ */
@media screen and (min-width: 481px) {
#content {
padding: 100px 0 0 0;
}
/* ヘッダー
------------------------------------------------------------*/
#header {
height: 100px;
}
h1 {
font-size: 2em;
}

/* 学習コース
------------------------------------------------------------*/
#course {
margin-top: -100px;
padding-top: 100px;
}
/* 教材の紹介
------------------------------------------------------------*/
#kyouzai {
margin-top: -100px;
padding-top: 100px;
}
#kyouzai_waku {
top:24%;
}
.kyouzai {
font-size: 1.8em;
}

/* 入会のご案内
------------------------------------------------------------*/
#info {
margin-top: -100px;
padding-top: 100px;
}

/* フッター
------------------------------------------------------------*/
#sitemap{
font-size: 1.6em;
}

}

/* ------ タブレット縦 ------ */
@media screen and (min-width: 769px) {
.pc-br {
display: block;
}

/* ヘッダー
------------------------------------------------------------*/
#header_waku {
width : -webkit-calc(100% - 70px) ;
padding: 20px 15px 0 15px;
}
#header2 {
position: relative;
}
#top_house{
position: absolute;
left: 5%;
bottom: 0;
}
#top_house img{
width: 85%;
max-width: 61px;
height: auto;
}
#top_rainbow{
width: 100%;
}
h1 {
font-size: 2.5em;
}
/* ドロワーメニュー */
#nav-drawer {
top: 65px;
}

/* イントロダクション
------------------------------------------------------------*/
#intro {
width : 700px;
}
.intro_txt {
width : 700px;
padding: 0;
}
#point_waku {
padding:0;
}
#intro_banner {
width: 100%;
flex-flow: row;
justify-content: space-around;
}
#intro_banner img {
margin: 20px 0;
width: 320px;
}

/* 学研教室について
------------------------------------------------------------*/
#about {
width : 700px;
}
#houshin_waku {
width: 600px;
margin: 0 auto;
display: grid;
gap: 10px;
grid-template-columns: 1fr 1fr;
grid-template-rows: 20%;
}
#houshin_waku img {
width: 300px;
}
.houshin {
padding: 10px;
}
.box1 {
grid-column: 1;
grid-row: 1 / 3;
}
.box2 {
grid-column: 2 / 3;
grid-row: 2 / 4;
}
.box3 {
grid-column: 1;
grid-row: 3 / 5;
}
.box4 {
grid-column: 2 / 3;
grid-row: 4 / 6;
}


/* 学習コース
------------------------------------------------------------*/
#course {
width : 700px;
}
#course img {
width: 600px;
}
.ck_txt {
margin: 5px 0 0 0;
width : -webkit-calc(95% - 30px) ;
max-width: 600px;
font-size: 1.6em;
line-height: 1.6em;
text-align: left;
}

/* 教材の紹介
------------------------------------------------------------*/
#kyouzai {
width : 700px;
}
#kyouzai_img img {
width: 600px;
}
#kyouzai_waku {
width: 200px;
height: 209px;
top:72px;
left: 355px;
}

/* 入会のご案内
------------------------------------------------------------*/
#information img {
width: 668x;
}
#info_waku {
width : 700px;
}

/* ようろう教室について
------------------------------------------------------------*/
#yourou {
width : 700px;
}
#teacher {
margin: 100px 0 30px 0;
}
.yourou_txt {
line-height: 1.7em;
}
#yourou_tel {
margin: 70px 0;
}
#yourou_contact {
margin: 0 0 150px 0;
}

/* お問い合わせ
------------------------------------------------------------*/
#contact {
width : 700px;
}
#form_waku {
margin: 50px auto;
}
.koumoku_waku {
display: flex;
}
.k_title {
width : -webkit-calc(30% - 1em) ;
margin: 0 1em 0 0;
font-size: 1.8em;
line-height: 1.2em;
}
.k_form {
width : -webkit-calc(70% - 1.2em) ;
}
.k_form_c {
width : -webkit-calc(70% - 1.2em) ;
}
input.f_button {
margin: 0 10px;
}
input.k_button {
margin: 0 10px;
}
.red {
margin: 0;
}
.button{
display: flex;
}
/* ラジオボタン */
.f_radio {
font-size: 1.8em;
}
/* チェックボックス */
.f_check {
font-size: 1.8em;
}

/* フッター
------------------------------------------------------------*/
#footer_name {
font-size: 2.8em;
}
#footer_add {
font-size: 2.2em;
}
#footer_tel {
font-size: 1.8em;
}

}

/* ------ PC ------ */
@media screen and (min-width:1024px) {
a[href^="tel:"]{
    pointer-events: none;
  }

#content {
padding: 120px 0 0 0;
}

/* ヘッダー
------------------------------------------------------------*/
#header {
height: 120px;
display: flex;
justify-content: space-between;
}
#header_waku {
width : 1000px;
margin: 0 auto;
justify-content: center;
padding: 20px 0 0 0;
}
#header1 {
width: 140px;
}
#header2 {
width : 360px;
padding: 0;
display: flex;
align-items: flex-end;
}
#top_house{
position: relative;
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 65px;
}
#top_house img{
width: 61px;
}
#top_rainbow{
width: 220px;
}
#top_rainbow img{
width: 116px;
}
h1 {
font-size: 2.5em;
}
#header3 {
width: 500px;
text-align: right;
}
#nav-drawer {
display: none;
}
nav ul{
display: flex;
overflow: hidden;
width: 100%;
height: 25px;
margin: 10px 0 0 0;
text-align: center;
}
nav ul li{
width: 100px;
font-size: 1.5em;
line-height: 22px;
border-right: 1px solid #000;
}
nav ul li:first-child{
border-left: 1px solid #000;
}
nav ul li a{
display: inline-block;
width: 100%;
text-decoration: none;
color: #000;
}
nav ul li a:hover{
border-bottom: 3px solid #fa7e19;
box-sizing:border-box;
text-decoration: none;
}
nav ul li.current a{
border-bottom: 3px solid #fa7e19;
box-sizing: border-box;
text-decoration: none;
}

/* イントロダクション
------------------------------------------------------------*/
#intro_title {
margin: 10px 0 20px 0;
}
#point {
height: 37px;
border-radius: 10px;
line-height: 37px;
}
/* 学習コース
------------------------------------------------------------*/
#course {
margin-top: -120px;
padding-top: 120px;
}

/* 教材の紹介
------------------------------------------------------------*/
#kyouzai {
margin-top: -120px;
padding-top: 120px;
}

/* 入会のご案内
------------------------------------------------------------*/
#info {
margin-top: -120px;
padding-top: 120px;
}

/* ページトップボタン
------------------------------------------------------------*/
.pagetop{
bottom: 60px;
right: 30px;
}
.pagetop img {
width: 100%;
}

}