body{
    color: #082848;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    line-height: 1.5;
}

img{
    width: 100%;
    height: auto;
}

a{
    text-decoration: none;
    color:#082848
}

a:hover{
    opacity: 0.7;
}

.container{
    width: 90%;
    max-width: 980px;
    margin: auto;
}
.clear::after{
    content: "";
    clear: both;
    display: block;
}

/*========header=========*/
header{
    padding: 20px 0;
}

.header-left{
    float: left;
}

.header-title {
    font-weight: bold;
    font-size: 24px;
    margin:10px;
  }

.header-right{
    float: right;
}

.header-nav-item{
    float: left;
    margin:10px;
}

.header-nav-item a{
font-size: 15px;
font-weight: 600;
line-height: 36px;
}

/*==top==*/
.top{
    background-image: url(../img/main-vsual-nontitle.jpg);
    background-size: cover;
    padding: 80px 0 ;
}

.top-title{
    font-size: 48px;
    font-weight:bold;
    text-align:center;
    margin-bottom:20px;
    color: #fff;
    text-shadow: 1px 2px 3px #808080;
}

.top-subtitle{
    font-size: 18px;
    text-align: center;
    color: #fff;
}


/*===section共通クラス===*/

.section{
    padding: 60px 0;
}

.section-title{
    font-size: 32px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 40px;
}

/*========about========*/

.about-left{
    float: left;
    width: 48%;
}

.about-right{
    float: right;
    width: 48%;
}

/*========course========*/

.course{
    background-color: #ff7979;
}

.course-wrapper{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.course-item{
    width: 30%;
}

.course-item img{
    border-radius: 99px;
}

.course-item p{
    text-align: center;
    color:#fff
}

/*========contact========*/

.contact-message{
    text-align: center;
    margin-bottom: 20px;
}

input[type="email"]{
   width: 600px;
   border: 3px solid #d8d8d8;
   font-size: 18px;
   display: block;
   margin: auto;
   padding: 15px;
   border-radius:999px;
   margin-bottom:20px;
}

.btn{
    padding:20px 60px;
    display: inline-block;
    background-color: #082848;
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    border-radius: 4px;
    border: none;
}

.btn-register{
 background-color:#fd1100 ;
 display: block;
 margin: auto;
}

.btn:hover{
opacity: 0.7;
cursor: pointer;
}

/*====footer====*/
footer{
    background-color: #000000;
    color: #fff;
    padding: 20px 0;
}

.copylight{
    font-size: 12px;
    float: right;
}

/* ==スマホ用の表示=== */

@media only screen and (max-width:767px){

.clear::after{
    content: none;
}

/* ==header=== */
.header-left{
    float:none;
}

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

.header-right{
    float: none;
}

.header-nav{
    display: flex;
    justify-content: space-between;
}

.header-nav-item{
    float:none;
    margin: 0;
}

/* ==top=== */
.top{
    padding: 120px 0;
}
.top-title{
    font-size: 32px;
}

.top-subtitle{
font-size: 14px;
}

/* ==section=== */
.section{
    padding: 80px 0 ;
}

.section-title{
    font-size: 24px;
    font-weight: bold
}
.section p {
    font-size: 14px;
}

/* ==about=== */
.about-left{
    float: none;
    width: 100%;
    margin-bottom: 20px;
}

.about-right{
    float: none;
    width: 100%;
}

/* ==course=== */
.course-item{
    width: 100%;
    margin-bottom: 20px;
}

/* ==contact=== */
input[type=email]{
width: 100%;
}

/*===footer==*/
.copylight{
    font-size: 10px;
    float: none;
    text-align: center;
}

}