* {
    margin:0;
	padding:0;
	word-wrap:break-word;
    overflow-wrap:break-word;
	box-sizing:border-box;
}

body {
    font-size:16px;
    font-family:"メイリオ",meiryo,"ＭＳ Ｐゴシック",ms p gothic,"ヒラギノ角ゴ Pro W3",hiragino kaku Pro W3, Osaka, sans-serif;
    background:#003;
    color:#333;
}
h1 {
    clear:both;
    margin:0 auto 32px 100px;
    padding:0 0 0 20px;
    line-height:1.3em;
    text-align:left;
    font-size:26px;
    border-left:4px solid;
    border-image:linear-gradient(#F06, #60C);
    border-image-slice:1;
    color:#FFF;
}
h2 {
    clear:both;
    margin:0 0 20px;
    line-height:1.3em;
    font-size:24px;
    font-weight:normal;
    color:#FFF;
}
h3 {
    padding:0 4em;
    line-height:1.3em;
    font-size:20px;
    color:#60C;
}
h4 {
    margin:12px 0 16px 24px;
    line-height:1.3em;
    font-size:22px;
}
p {
    text-align:left;
}
ul {
    margin:0 auto;
    width:1000px;
    list-style:none;
}
img {
    border:none;
}
a {
    text-decoration:none;
    color:#333;
}
a:hover {
    opacity:0.8;
}

.f18 {
    display:block;
    margin:0 0 4px;
    font-size:18px;
    font-weight:bolder;
}
.f20 {
    display:block;
    margin:0 0 24px;
    line-height:1.3em;
    text-align:center;
    font-size:20px;
    font-weight:bolder;
}
.f24 {
    display:block;
    margin:0 0 12px;
    line-height:1.3em;
    font-size:24px;
    font-weight:bolder;
}

#container {
    z-index:0;
    position:relative;
    margin:0 auto;
    width:1200px;
    text-align:center;
}

#top {
    margin:0 auto 20px;
    padding:400px 0 0;
    width:1000px;
    background:url("img/topbanner-pc.png") top no-repeat;
}
#top p {
    margin:24px 0 0;
    line-height:1.3em;
    font-size:18px;
    color:#FFF;
}

.border {
    clear:both;
    margin:0 0 60px;
    border-bottom:3px solid;
    border-image:linear-gradient(90deg, #60C, #F06);
    border-image-slice:1;
}

#question li {
    float:left;
    margin:0 0 36px;
    width:482px;
    background:#FFF;
    border-radius:0 0 1em 1em;
}
#question li:first-child {
    width:100%;
}
#question li:nth-child(2) h3 {
    padding:0 3em;
}
#question li:last-child {
    margin:0 0 48px 36px;
}
#question h3 {
    margin:0 auto 32px;
}
.qlead {
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0 0 28px;
    padding:0.7em 2em;
    text-align:center;
    background:linear-gradient(90deg, #60C, #b20099, #F06);
}
.qlead p {
    margin:0 0 0 16px;
    font-size:20px;
    color:#FFF;
}
.qtxt {
    margin:16px 0 0;
    padding:0 2.5em 2.5em;
}
.fstimg {
    float:left;
    margin:0 2.5em 3.5em 3.2em;
}

#point {
    clear:both;
    display:flex;
    margin:0 auto;
    padding:2.5em;
    width:1000px;
    background:linear-gradient(90deg, #F06, #b20099, #60C);
    color:#FFF;
}
#point p {
    flex-basis:640px;
    margin:0 30px 0 0;
    line-height:1.3em;
    font-size:18px;
}
#point img {
    width:100%;
}
.pointimg {
    flex-basis:330px;
}

.plead {
    margin:0 auto 24px;
    padding:0.7em 0 0.8em;
    text-align:center;
    background:#60C;
}
.plead img {
    width:28%;
}
.tri {
    margin:0 auto 24px;
    width:0;
    height:0;
    border-left:2em solid transparent;
    border-right:2em solid transparent;
    border-top:#B20099 2.5em solid;
}

#pbox {
    display:flex;
    justify-content:space-between;
    margin:0 auto 40px;
    width:1000px;
}
#pbox h3 {
    margin:0 auto 24px;
    padding:0 0 16px;
    border-bottom:#C4A6D0 7px dotted;
}
.b1 {
    flex-basis:482px;
    background:#FFF;
    border-radius:0 0 1em 1em;
}
.b1 h3 {
    width:310px;
}
.b2 {
    flex-basis:482px;
    background:#FFF;
    border-radius:0 0 1em 1em;
}
.b2 h3 {
    width:290px;
}
.btxt {
    padding:0 2.5em 2.5em;
}

#spec {
    margin:0 auto 40px;
    padding:0;
    width:1000px;
}
.slead {
    z-index:1;
    position:absolute;
    display:flex;
    justify-content:center;
    align-items:flex-end;
    margin:-2.5em 0 0;
    width:1000px;
}
.slead p {
    margin:0 0 0 16px;
    font-size:24px;
    font-weight:bolder;
}
#spec ul {
    padding:6em 2.5em 0;
    height:410px;
    background:#FFF;
    border-radius:1em;
}
#spec li {
    float:left;
    padding:0 1em;
    width:33.33%;
    text-align:center;
    font-size:18px;
}
#spec li img {
    display:block;
    margin:0 auto 16px;
}

.list {
    margin:36px auto 0;
}
.list li {
    float:left;
    margin:0 35px 35px 0;
    padding:2em 2em 2.5em;
    width:310px;
    background:#FFF;
}
.list li:nth-child(3n) {
    margin:0 0 35px;
}
.list li:last-child {
    margin:0 0 72px;
}
.list img {
    margin:0 auto 24px;
    width:100%;
}
.list p {
    overflow:hidden;
    width:100%;
    height:7.5em;
    text-align:center;
}

.linkbutton {
    display:block;
    margin:32px auto 0;
    width:15em;
    padding:0.4em 1em 0.3em;
    text-align:center;
    background:#667EEA;
    color:#FFF;
}
.linkbutton a {
    color:#FFF;
}
.linkbutton a:after {
    display:block;
    float:right;
    content:"▼";
    transform:rotate(30deg);
}

.pcset {
    display:flex;
    align-items:flex-start;
    margin:0 auto 40px;
    padding:2em 2.5em 2.5em 2em;
    width:1000px;
    background:#FFF;
    border-radius:0 3em 0 3em;
}
.psdata {
    padding:0 3em 0 2em;
    flex-basis:55%;
    text-align:left;
}
.psdata p {
    margin:0 0 0 24px;
}
.psimg {
    padding:0 3em 0 0;
    flex-basis:45%;
}
.psimg .linkbutton {
    float:right;
}
.pcset + h1 {
    margin:60px 0 24px;
}

#pp li {
    float:left;
    display:flex;
    justify-content:space-between;
    margin:0 0 40px;
    width:95%;
    background:linear-gradient(-45deg, #60C 10%, #F06 85%);
}
#pp li p {
    padding:3em 0 3em 3em;
    flex-basis:45%;
    color:#FFF;
}
.ppimg {
    flex-basis:55%;
    height:499px;
    background:url("img/pp-pc01.png") right no-repeat;
}
#pp li:last-child {
    float:right;
    margin:0 0 60px;
    background:linear-gradient(45deg, #60C 10%, #F06 85%);
}
#pp li:last-child p {
    padding:3em 3em 3em 0;
    flex-basis:45%;
    color:#FFF;
}
#pp li:last-child .ppimg {
    flex-basis:55%;
    height:499px;
    background:url("img/pp-pc02.png") left no-repeat;
}

#foot {
    clear:both;
    margin:0 auto 32px;
}
#foot a {
    text-decoration:none;
    color:#FFF;
}

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

h1 {
    margin:0 auto 6%;
    padding:0 0 0 1em;
    width:92%;
    font-size:20px;
}
h2 {
    margin:0 auto 6%;
    width:92%;
    font-size:18px;
}
h3 {
    padding:0 2em;
    font-size:18px;
}
h4 {
    margin:0.5em 0 1em;
    font-size:18px;
}
ul {
    width:100%;
}
img {
    max-width:100%;
}

.f18 {
    margin:0 0 0.3em;
    font-size:16px;
}
.f20 {
    margin:0 0 1em;
    font-size:18px;
}
.f24 {
    margin:0 0 1em;
    font-size:20px;
}

#container {
    width:100%;
}

#top {
    margin:0 auto 1%;
    padding:47.6% 0 0;
    width:100%;
    background:url("img/topbanner-sp.png") top no-repeat;
    background-size:100%;
}
#top p {
    margin:1.5em 4% 0;
    font-size:16px;
}

.border {
    margin:0 0 12%;
    border-bottom:2px solid;
}

#question {
    margin:0 auto;
    width: 92%;
}
#question li {
    float:none;
    margin:0 0 7%;
    width:100%;
    border-radius:0 0 0.5em 0.5em;
}
#question li:nth-child(2) h3 {
    padding:0 2em;
}
#question li:last-child {
    margin:0 0 12%;
}
#question h3 {
    margin:0 auto 1.2em;
}
.qlead {
    margin:0 0 1.5em;
    padding:0.6em 1.5em;
}
.qlead p {
    margin:0 0 0 1em;
    line-height:1.2em;
    font-size:18px;
}
.qtxt {
    margin:1.5em auto 0;
    padding:0 2em 2.5em;
}
.fstimg {
    float:none;
    margin:0;
}

#point {
    flex-flow:wrap;
    margin:0 auto;
    padding:2em;
    width:92%;
}
#point p {
    flex-basis:100%;
    margin:0 0 5%;
    font-size:16px;
}
.pointimg {
    flex-basis:100%;
}

.plead {
    margin:0 auto 1.5em;
    padding:0.6em 0 0.7em;
}
.plead img {
    width:30%;
}
.tri {
    margin:0 auto 4%;
    border-left:1.5em solid transparent;
    border-right:1.5em solid transparent;
    border-top:#B20099 2em solid;
}

#pbox {
    flex-flow:wrap;
    justify-content:center;
    margin:0 auto 11%;
    width:92%;
}
#pbox h3 {
    margin:0 auto 1em;
    padding:0 0 0.8em;
}
.b1 {
    margin:0 0 7%;
    flex-basis:100%;
    border-radius:0 0 0.5em 0.5em;
}
.b1 h3 {
    width:80%;
}
.b2 {
    margin:0;
    flex-basis:100%;
    border-radius:0 0 0.5em 0.5em;
}
.b2 h3 {
    width:80%;
}
.btxt {
    padding:0 2em 2.5em;
}

#spec {
    margin:0 auto 6%;
    width:92%;
}
.slead {
    margin:-0.5% auto 0;
    width:84%;
}
.slead img {
    margin:0 0 0 0.5em;
    width:20%;
}
.slead p {
    margin:0 0 0 0.8em;
    line-height:1.3em;
    font-size:18px;
}

#spec ul {
    padding:5em 2em 1.5em;
    height:auto;
    border-radius:0.5em;
}
#spec li {
    float:none;
    margin:0 0 10%;
    padding:0;
    width:100%;
    font-size:16px;
}
#spec li:last-child {
    margin:0;
}
#spec li img {
    margin:0 auto 4%;
    width:50%;
}

.list {
    margin:8% auto 0;
    width:92%;
}
.list li {
    float:none;
    margin:0 0 7%;
    width:100%;
}
.list li:nth-child(3n) {
    margin:0 0 6%;
}
.list li:last-child {
    margin:0 0 12%;
}
.list img {
    margin:0 auto 2em;
    width:90%;
}
.list p {
    height:auto;
}

.linkbutton {
    margin:2em auto 0;
    width:18em;
    padding:0.4em 1em 0.3em;
    font-size:3.75vw;
}

.pcset {
    flex-flow:wrap;
    margin:0 auto 6%;
    padding:1.5em 2em 2em;
    width:92%;
    border-radius:0 2em 0 2em;
}
.psdata {
    margin:0 0 6%;
    padding:0;
    flex-basis:100%;
}
.psdata p {
    margin:0;
}
.psdata img {
    width:16%;
}
.psimg {
    padding:0;
    flex-basis:100%;
}
.psimg img {
    margin:0 auto;
    width:92%;
}
.psimg .linkbutton {
    float:none;
    margin:2.5em auto 0.5em;
}
.pcset + h1 {
    margin:0 0 12%;
}

#pp li {
    float:none;
    display:flex;
    flex-flow:wrap;
    justify-content:center;
    margin:0 auto 7%;
    width:100%;
}
#pp li p {
    padding:2.5em 2em;
    flex-basis:100%;
}
.ppimg {
    flex-basis:100%;
    padding:0 0 53.8%;
    height:auto;
    background:url("img/pp-sp01.png") top no-repeat;
    background-size:100%;
}
#pp li:last-child {
    float:none;
    flex-flow:column-reverse;
    margin:0 auto 12%;
}
#pp li:last-child p {
    padding:2.5em 2em;
    flex-basis:100%;
}
#pp li:last-child .ppimg {
    flex-basis:100%;
    padding:0 0 53.8%;
    height:auto;
    background:url("img/pp-sp02.png") top no-repeat;
    background-size:100%;
}

#foot {
    margin:0 auto 6%;
    width:90%;
    font-size:14px;
}
}