@charset "UTF-8";

body{font-family: "sicprintempspetit", sans-serif;
font-weight: 400;
font-style: normal;
color: #755e4f;
margin:0;
padding:0;
box-sizing:border-box;}

@media screen and (min-width: 960px) {
	/* 960px以上に適用されるCSS（PC用） */

.header1 img{
    margin-top: 0;
    margin-bottom: 10px;
width: 100%;
height: auto;}

nav ul{
    display: flex;
    justify-content: center;
    gap: 30px;
    text-decoration: none;
    list-style: none;
    font-size: 30px;
}
.gnavi {
    width:100%;
    background-color: white;
    position: sticky;
    top:0;
}

.icon1, .icon2, .icon3, .icon4, .icon5, .icon6 {
    height:120px;
    width:auto;
padding-right: 10px;}

section h1{
    font-size: 40px;
    font-weight: 800;
    display: flex;
align-items: center;
margin-left: 10%;
margin-right: 10%;
}

.section1 div{
    display: flex;
    margin:5% auto;
    text-align: center;
    }
.yoko img{
    height:auto;
    width:90%;
}
.tate img{
    height:300px;
    width: auto;
}

.section1 ul{margin: 0 auto;
list-style: none;
text-decoration: none;}
.section1 p{
    text-align: center;
    font-size: 30px;
}
.viewmore1{
    display: flex;
    justify-content: center;
}
.button1{
    justify-content: center;
    height:100px;
    width:auto;}

.wrap4{
    margin-top:5%;
    margin-bottom:5%;
    display: flex;
    align-items: center;
    justify-content: left;
    margin-left: 25%;
    margin-right: 25%;}

    .wrap4 img{
    margin-top: 0;
    justify-content: left;}
    .marc, .flowmarc {
    height:80px;
    width:80px;}

    .inner2{
    margin-top: 0;
    padding-left: 5px;}
    .inner4{
    margin-top: 0;
    width: 80%;
    padding-left: 5px;
    }

.large{
    font-weight: 800;
    font-size: 30px;
}
.large2{
    font-size: 30px;
}
.viewmore2{
    display: flex;
    justify-content: center;}
.button2{
    justify-content: center;
    height: 100px;
    width: auto;
margin: 3%;}

.watashidai{
    height: 200px;
    width: auto;}
.section3 ul{
    list-style: none;
text-decoration: none;}
.section3 dt{
    font-size: 36px;}
.section3 div{
    text-align: center;
    justify-content: center;
    margin-top:5%;
    margin-bottom:5%;}

.pagetop{
    position:fixed;
    right: 10px;
    bottom: 70px;}
.pagetopimg{
        width:80px;
    height:auto;}

footer{
    height:300px;
    background-color: #d5ebe8;
    text-align: center;
    margin-top: 10px;}
    footer ul{
        list-style: none;
        text-decoration: none;
    }
.watashi{
    height:150px;
    width:auto;
    margin-top: 20px;}
.camera{
    height:50px;
    width: auto;}
.cyosakuken{
    margin-top:240px;}

/* ここからMENU----------------------------------- */
.header2 img{
    margin-top: 0;
    margin-bottom: 10px;
width: 100%;
height: auto;}
.section4, .section5, .section6 {font-size: 16px;}

.flowmarc{
    margin-top: 0;}

.toiawaseform{
    display: flex;
    justify-content: center;
    height: 50px;
    width: auto;
    margin-bottom: 50px;}

.jisseki {height:auto;
width:60%;}

.section5 ul{
text-align: center;
list-style: none;
text-decoration: none;
margin:5% auto;
}
.section6 ul{
text-align: center;
list-style: none;
text-decoration: none;
margin:5% auto;
}

#color {
    background-color: #d5ebe8;
    width:70%;
    margin-left: 10% ;
    margin-right: 10% ;
    font-size: 20px;
}
}

@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用）---------------------------------------------- */

    body{font-size: 12px;}
.header1 img{
    margin-top: 0;
    margin-bottom: 10px;
width: 100%;
height: auto;}

nav ul{
    display: flex;
    justify-content: center;
    gap: 20px;
    text-decoration: none;
    list-style: none;
    font-size: 20px;
}

.gnavi {
    width:100%;
    background-color: white;
    position: sticky;
    top:0;
}


.section1 h1, .section2 h1, .section3 h1, .section4 h1, .section5 h1, .section6 h1 {
font-size: 20px;
font-weight: 800;
display: flex;
align-items: center;
margin-left: 0px;
margin-top: 3%;}

.icon1, .icon2, .icon3, .icon4, .icon5, .icon6 {
    height:60px;
    width:auto;
padding-left: 3%;
padding-right: 3%;}

.section1 div{
display: flex;
margin-top:3%;
margin-bottom: 3%;
margin-left: 0 auto;
margin-right: 0 auto;
text-align: center;
}
.section1 ul{
margin:1%;
list-style: none;    
text-decoration: none;}

.yoko img{
    width:80%;
    height:auto;
}

.tate img{
    height:100px;
    width:auto;
}
.section1 ul{
font-size: 12px;
list-style: none;
text-decoration: none;}    
.section1 p{
    text-align: center;
    font-size: 12px;}


.viewmore1{
    display: flex;
    justify-content: center;}
.button1{
    justify-content: center;
    height:50px;
    width:auto;}


.viewmore2{
    display: flex;
    justify-content: center;}
.button2{
    display: flex;
    justify-content: center;
    height: 50px;
    width: auto;}

.watashidai{
    height: 160px;
    width: auto;}

.wrap4{
    margin-top:3%;
    margin-bottom:3%;
    display: flex;
    align-items: center;
    justify-content: left;
    margin-left: 5% ;
    margin-right: 3%;}
.wrap4 img{
    margin-top: 0;
    justify-content: left;}
.marc{
    height:auto;
    width:15%;}
.flowmarc{
    height:auto;
    width:15%;
padding-left: 1%;}
.marc, .flowmarc {
    height:50px;
    width:50px;
padding-left: 1%;}

.inner2, .inner4{
    display: flex;
    flex-direction: column;
    margin-top: 0;
    width:75%;
padding-left: 5%;
padding-right: 0%;}
.inner4 p {font-size: 12px;}


.large{
    font-weight: 800;
    font-size: 16px;
}
.large2{
    font-size: 16px;
}

.section3 ul, .section5 ul, .section6 ul {
    list-style: none;
    text-decoration: none;
    text-align: center;
font-size: 12px;}

.section3 dt{
    font-size: 20px;}
.section3 dd{font-size: 12px;}
.section3 div{
    text-align: center;
    justify-content: center;
    margin:3%;}

.section3 a{
    text-align: center;
    display: flex;
    justify-content: center;}

#color {
    background-color: #d5ebe8;
    width:80%;
    margin-left: 10% ;
    margin-right: 10% ;
    font-size: 16px;
}

.pagetop{
    position:fixed;
    right: 5px;
    bottom: 50px;}
.pagetopimg{
        width:50px;
    height:auto;}

footer{
    height:300px;
    background-color: #d5ebe8;
    text-align: center;
    margin-top: 10px;}
    footer ul{
        list-style: none;
        text-decoration: none;
    }
.watashi{
    height:150px;
    width:auto;
    margin-top: 20px;}
.camera{
    height:50px;
    width: auto;}
.cyosakuken{
    margin-top:240px;}
/*-MENU Page スマホ---------------------*/
.header2 img{
    margin-top: 0;
    margin-bottom: 10px;
width: 100%;
height: auto;}

.wrap4{
    margin-top:3%;
    margin-bottom:3%;
    margin-left:1% auto;
    margin-right: 1% auto;
    display: flex;
    align-items: center;}

.wrap4 img{
        margin-top: 0;}


.section4, .section5, .section6 {font-size: 14px;}

.inner4 img{
    margin-top: 0;
}
.inner4 dt{
    margin-left: 0;
    margin-top: 0;
    font-size: 16px;
}
.inner4 dd{
    margin-left: 0;
font-size: 12px;}

.toiawaseform{
    display: flex;
    justify-content: center;
    height: 50px;
    width: auto;
    margin-bottom: 50px;}

.section5 ul{
    margin-left: 1% auto;
    margin-right: 1% auto;
margin-top: 10%;
text-align: center;
list-style: none;
text-decoration: none;
}

.section5 ul img, .section6 ul img{
    width: 90%;
height: auto;}

.section6 ul{
text-align: center;
list-style: none;
text-decoration: none;
margin:5%;
}

.watashi{
    height:150px;
    width:auto;
    margin-top: 5px;}
.camera{
    height:50px;
    width: auto;}
.cyosakuken{    margin-top:220px;}
}
	/* 480px以下に適用されるCSS（ここまでスマホ用）------------------------------------------- */