@charset "UTF-8"; 

*{
    padding: 0;
    margin: 0;
}

.sawarabi-gothic-regular {
  font-family: "Sawarabi Gothic", sans-serif;
  font-style: normal;
}




.fixinfo {
    width: 5vw;
    height: 20vw;
    border-radius: 2.5vw;
    background-color:  #aa64c8;
    position: fixed;
    top: 15vw;
}


.fixinfo p {
    font-size: 1.7vw;
    font-weight: 500;
    line-height: 6;
    text-align: center;
}


.fixinfo  a {
    display: block;
    writing-mode: vertical-rl;
    text-decoration: none;
    line-height: 3;
    padding-top: 5.5vw;
    color: white;
}




/*  */

header{
    display: flex;
    height: 7vw;
    padding: 2%;
}


h1{
    width: 30%;
}


h1 img{
    width: 100%;
}



/* nav周り */
nav{
    width: 50%;
    margin-top: 2vw;
    margin-left: auto;
}


nav ul{
    display: flex;
    list-style: none;       
}


nav ul li{
    width: 25%;
}


nav ul li a{
    display: block;
    text-align: center;
    line-height: 3;
    text-decoration: none;
    color: #202020;
    font-size: 1.3vw;
    transition: 1s;
    border-radius: 1vw;
}

nav ul li a:hover{
    color: rgb(82, 141, 230);
    transition: 1s;
}

/* メイン//////////////////////////////// */

body {

}

/*  section1  */

body {
    background-image: url(../images/base04.jpg);
    background-repeat: no-repeat;
    background-position: 5vw -10vw;
    background-repeat: no-repeat;
}

.section {
    width: 100%;
    height: 30vw;
}

.section h2 {
    padding-top: 5vw;
    margin-bottom: 4vw;
    font-size: 4vw;
    text-align: center;
    color: #202020;
}

.section p {
    width: 70%;
    margin-left: auto;
    margin-right: auto;
    line-height: 2;
    white-space: pre-wrap;
    text-align: center; 
    color: #202020;   
}


/*  section2  */

.section2 {
    width: 88%;
    height: 55vw;
    margin-left: auto;
    margin-right: auto;
    background-color: ;
    opacity: 0.8;
    border-radius: 2.5vw;
    background-color: ;
}

.section2  h2 {
    width: 78%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2.3vw;
    line-height: 3;
    color: #557c96;
    border-bottom: 1px solid  #557c96;
}

.section2 article {
    display: flex;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 4vw;
}


.section2-ph {
    width: 46%;
}

.section2-ph img {
    width: 100%;
    border-radius: 2vw;
}

.section2-ph:nth-of-type(1) {
   margin-right: 8%;
}

.section2 article p {
    margin-top: 2vw;
    line-height: 1.2;
    line-height: 1.9;
    font-size: 1.5vw;
}


/*  section3  */

.section3 {
    width: 88%;
    height: 55vw;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5vw;
    background-color: ;
    opacity: 0.8;
    border-radius: 2.5vw;
}

.section3  h2 {
    width: 78%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    padding-top: 2.3vw;
    line-height: 3;
    color: rgb(155, 89, 152);
    border-bottom: 1px solid  rgb(155, 89, 152);
}




.section3 article {
    display: flex;
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 4vw;
}


.section3-ph {
    width: 46%;
}

.section3-ph img {
    width: 100%;
    border-radius: 2vw;
}

.section3-ph:nth-of-type(1) {
   margin-right: 8%;
}

.section3 article p {
    margin-top: 2vw;
    line-height: 1.2;
    font-size: 1.5vw;
    line-height: 1.9;
}


.footer-imag {
    width: 100%;
    height: 20vw;
    background-color: ;
}


/* ///////////////フッター////////////// */

footer {
    width: 100%;
    height: 38vw;
    margin-top: 7vw;
    background-color:  #D9F6FE;
}


.footer-container {
    width: 70%;
    padding-top: 5vw;
    margin-left: auto;
    margin-right: auto;
}


.footer-container-top {
    display: flex;
    width: 100%;
    height: 10vw;
}


.footer-logobox {
    width: 40%;
}


.footer-logobox img {
    width: 100%;
}


.footer-txetbox {
    display: flex;
    width: 100%;
    margin-left: 10%;
}


.footer-txetbox .left  {
    width: 15%;
}


.footer-txetbox .center {
    width: 35%;
    margin-left: 9%;
    margin-right: 6%;
}

.footer-txetbox .right {
    width: 35%;
}

/*  */

.footer-txetbox ul {
    list-style-type: none;    
    text-decoration: none;
}


.footer-txetbox ul li{
    width: 100%;
}


.footer-txetbox ul li a{
    display: block;
    line-height: 2.2;
    text-decoration: none;
    color: #202020;
    font-size: 1.2vw;
    transition: 1s;
}


nav ul li a:hover{
    transition: 1s;
}

/*  */

.footer-container-bottom {
    display: flex;
    width: 100%;
    height: 35px;
    margin-top: 5vw;
    margin-bottom: 4vw;
    border-top: 0.4px dotted #202020;
    border-bottom: 0.4px dotted #202020;
}

.footer-container-bottom p:nth-of-type(1) {
    text-align: center;
    font-size: 1.5vw; 
    margin-left: 5vw;
    padding-top: 1vw;
    color: #202020;
}

.footer-container-bottom p:nth-of-type(2) {
    font-size: 2vw; 
    font-weight: 500;
    margin-left: auto;
    margin-right: auto;
    padding-top: 1vw;
    color: #202020;
}


.copy {
    width: 100%;
}

.copy {
    padding-top: 3%;
    padding-bottom: 3%;
    margin-top: 4%;
    text-align: center;
    background-color: rgb(112, 201, 201);
    color: white;
}



