footer{
background:#eee;
padding:25px 3px 20px 10px;
margin-top:70px;
}
footer div{
max-width:980px;
margin:auto;
font-size:80%;
color:#777;
}

.sponly{display:none;}

body{
margin:0;
padding:0;
font-family:sans-serif;
}
header{
border-top:2px solid #da0000;
box-shadow:0px -8px 4px -4px rgba(0,0,0,0.1) inset;
padding-bottom:2px;
}
header div{
max-width:980px;
margin:9px auto;
}

form{
margin:0;
padding:0;
}
em{
font-style:normal;
}

div.title{
background:#eee;
}
h1{
max-width:980px;
margin:10px auto;
padding:10px;
font-size:120%;
}
h1.readovermsg{
margin:50px auto 70px;
padding:40px 0;
font-size:1.6rem;
font-weight:normal;
width:96%;
max-width:750px;
text-align:center;
border:2px solid #ddd;
border-width:2px 0;
box-sizing:border-box;
position:relative;
}
h1.readovermsg span.keyicon{
white-space:nowrap;
}
h1.readovermsg span.keyicon img{
height:1.8rem;
margin:0 2px 0 3px;
vertical-align:-3px;
}
h1.readovermsg:before,
h1.readovermsg:after{
content:"";
position:absolute;
left:calc(50% - 25px);
bottom:-35px;
font-size:0;
width:0;
height:0;
border-style:solid;
border-width:20px 25px 0;
border-color:#ddd transparent transparent;
}
h1.readovermsg:after{
bottom:-60px;
}

h2{
text-align:center;
background:#eee;
font-size:130%;
padding:17px;
margin:25px auto;
}
h3{
text-align:center;
font-size:125%;
margin:25px auto;
}

div.first{
margin:40px auto;
max-width:580px;
padding:0 10px;
position:relative;
}
div.first p{
margin:0;
padding:0 100px 0 0;
font-size:1.1rem;
line-height:2;
}
div.first em{
color:#b90000;
}
div.first img.image{
position:absolute;
top:calc(50% - 60px);
right:10px;
width:100px;
}
div.first img.keyicon{
height:20px;
margin-right:1px;
vertical-align:-2px;
}

div.simpleform{
margin:25px 10px 10px;
border:3px solid #b90000;
border-radius:5px;
text-align:center;
position:relative;
}
div.simpleform h2{
margin:-17px auto 7px;
width:280px;
padding:0;
font-size:125%;
color:#b90000;
background:#fff;
}
div.simpleform p{
margin:15px auto;
}
div.simpleform p.price{
margin-bottom:7px;
font-size:80%;
}
p.price span.firstfree{
font-weight:normal;
font-size:125%;
border:1px solid #b90000;
color:#b90000;
border-radius:4px;
padding:4px 5px;
margin:0 10px;
white-space:nowrap;
}
div.simpleform p.caution{
font-size:85%;
text-align:center;
margin:4px 0 10px;
}
p.pleaseSelect{
font-weight:bold;
font-size:115%;
}
div.simpleform > div{
margin:0 0 15px;
padding:0;
}
div.simpleform > div h3{
font-weight:normal;
font-size:100%;
margin:3px 0;
padding:0;
}
div.simpleform > div img{
width:296px;
height:60px;
}
div.simpleform p.faq{
font-size:70%;
margin:4px 0 12px;
}

p.price{
text-align:center;
font-size:90%;
line-height:1.3;
margin:0;
}
p.price span{
color:#b90000;
font-size:180%;
margin:0 3px 0 4px;
font-weight:bold;
}
p.price small{
margin-left:-100px;
}

div.courseBox{
border:2px solid #ccc;
margin:15px 10px;
}

div#simplebox{
border-color:#d60000;
}
div#digitalbox{
border-color:#ff9d00;
}
div#doublebox{
border-color:#0027ff;
}

div#simplebox ul.point em{
background:linear-gradient(transparent 50%,#fff1f1 50%);
}
div#digitalbox ul.point em{
background:linear-gradient(transparent 50%,#fffde1 50%);
}
div#doublebox ul.point em{
background:linear-gradient(transparent 50%,#e6faff 50%);
}
div.courseBox a{
color:#fff;
text-decoration:none;
padding:11px 2px;
display:block;
text-align:center;
margin:5px 12px 12px;
font-size:110%;
border-radius:2px;
}
div.courseBox a span{
font-size:80%;
}
div#simplebox a{
background:#d60000;
}
div#digitalbox a{
background:#ff9d00;
}
div#doublebox a{
background:#0027ff;
}

div.courseBox h4{
text-align:center;
font-size:130%;
margin:0;
padding:5px 0;
}
div.courseBox h4 img{
width:58px;
min-height:58px;
vertical-align:middle;
margin-left:-70px;
margin-right:12px;
transform:rotate(-5deg);
}

div#simplebox h4{
background:#FFF8F8;
margin-bottom:3px;
}
div#digitalbox h4{
background:#FFF9EF;
margin-bottom:3px;
}
div#doublebox h4{
background:#F5F7FF;
}

div.courseBox li{
margin:8px 0;
font-size:95%;
position:relative;
list-style:none;
}
div.courseBox li::after {
display:block;
content:'';
position:absolute;
top:.4em;
left:-1.1em;
width:10px;
height:5px;
border-left:3px solid #000;
border-bottom:3px solid #000;
transform:rotate(-50deg);
}
div#simplebox li::after{
border-color:#d60000;
}
div#digitalbox li::after{
border-color:#ff9d00;
}
div#doublebox li::after{
border-color:#0027ff;
}

div.courseBox li img.keyicon{
height:1rem;
margin:0 1px;
}

p.simple_memo{
color:#666;
font-size:75%;
text-align:center;
margin:-10px 0 5px;
padding:0;
}

table{
border:2px solid #aaa;
margin:5px;
border-collapse:collapse;
box-sizing: border-box;
}
thead th{
border-top:2px solid #aaa;
border-bottom:2px solid #bbb;
}
thead td{
border-top:2px solid #aaa;
border-bottom:2px solid #bbb;
background: #f5f5f5;
font-weight:bold;
color:#444;
}
tbody tr:nth-child(odd) th{
background: #f5f5f5;
}
tbody tr:nth-child(odd) td:nth-of-type(1){
background:#FFF8F8;
}
tbody tr:nth-child(odd) td:nth-of-type(2){
background:#FFF9EF;
}
tbody tr:nth-child(odd) td:nth-of-type(3){
background:#F5F7FF;
}
th{
font-weight:normal;
text-align:left;
border-top:1px solid #ddd;
border-right:2px solid #aaa;
padding:7px;
}
th img.keyicon{
height:1rem;
margin:0 1px;
}
th p img{
height:12px;
}
th p{
font-size:80%;
margin:2px 0 0 8px;
color:#7b5c00;
}

th ul img{
height:18px;
margin-bottom:3px;
margin:0 1px 3px;
}
th ul{
font-size:80%;
margin:3px 0 0 8px;
padding:0;
color:#7b5c00;
list-style:none;
}
th li{
display:inline;
padding:0;
}

td{
text-align:center;
padding:5px 1px;
border-top:1px solid #ddd;
border-right:1px solid #aaa;
width:20%;
}
td img{
width:18px;
min-height:18px;
margin-bottom:-3px;
}

/* -------------- 980以下 -------------- */
@media screen and (max-width:980px){

/*980以下の時は左右に余白を持たす*/
header div{
margin:9px;
}

}/*max-width:980px*/
/* -------------- /980以下 -------------- */
/* -------------- 768以上 -------------- */
@media screen and (min-width:768px){

h2,h3{
margin:35px auto;
}

div.simpleform{
margin:40px auto 10px;
max-width:750px;
display:flex;
justify-content:center;
flex-wrap:wrap;
}
div.simpleform h2{
margin:-17px 0 7px;
width:290px;
font-size:130%;
}
div.simpleform p{
width:100%;
}
div.simpleform > div{
width:350px;
}
div.simpleform p.faq{
margin:1px 0;
}

div.courseBox{
display:flex;
justify-content:space-between;
max-width:750px;
margin:20px auto;
}
div.courseBox div{
width:50%;
}
div#simplebox .name{
background:#FFF8F8;
padding-top:8px;
}
div#digitalbox .name{
background:#FFF9EF;
padding-top:20px;
}
div#doublebox .name{
background:#F5F7FF;
padding-top:2px;
}
div.courseBox h4 img{
vertical-align:-20px;
}
div.courseBox a{
margin:5px auto 12px;
width:350px;
}
div.courseBox li{
margin:10px 0;
font-size:100%;
}
p.simple_memo{
font-size:70%;
margin:-12px 0 0px;
}

table{
max-width:750px;
margin:5px auto;
}

}/*min-width:768px*/
/* -------------- /768以上 -------------- */
/* -------------- 480以下 -------------- */
@media screen and (max-width:480px){

.sponly{display:block;}

/*フッター*/
footer div{
font-size:70%;
color:#777;
text-align:left;
}

h1{
margin:5px auto;
}
h1.readovermsg{
padding:0 10px;
border:none;
text-align:left;
}
h1.readovermsg:before,
h1.readovermsg:after{
content:"";
position:absolute;
left:calc(50% - 20px);
bottom:-25px;
font-size:0;
width:0;
height:0;
border-style:solid;
border-width:15px 15px 0;
border-color:#ddd transparent transparent;
}
h1.readovermsg:after{
bottom:-45px;
}

div.first{
margin:30px 10px;
}
div.first p{
padding:0 90px 0 0;
font-size:1rem;
line-height:1.8;
}
div.first img.image{
width:90px;
}
div.first img.keyicon{
height:18px;
}

div.simpleform p.price{
/*margin:8px 10px 5px;
line-height:1.8;*/
}
p.price span.firstfree{
font-size:115%;
padding:4px 5px;
margin:0 0 0 8px;
}
div.simpleform p.caution{
margin:10px 5px 15px;
}
div.courseBox a span{
display:block;
margin-top:2px;
}
div#doublebox p.price{
margin-top:3px;
}
table{
font-size:90%;
}
thead span{
display:block;
white-space:nowrap;
}
th{
padding:6px 3px;
}
td{
width:calc(100vw / 6);
}

}/*max-width:480px*/
/* -------------- /480以下 -------------- */
/* -------------- 320以下 -------------- */
@media screen and (max-width:320px){

div.simpleform{
margin:25px 5px 10px;
}

}/*max-width:320px*/