@charset "utf-8";
/* スマホとPAD用 */
@media screen and (max-width: 768px) {

.pc { display: none;}
/*-------------------------------------------
navi
-------------------------------------------*/
.flex header {
/* background-color: hotpink; */
background-color:  #222;
flex: 1 1 20%;
background-image:none;
background-position:top right;
background-repeat:repeat-y;
}

.flex header > .box-center {
height:7rem;
margin:0 0 0 0;
background:transparent;
}
.flex header > .box-center > .box-inner {
background-color: transparent;
margin:0 0 0 0;
padding: 10px 5% 0 5%;
}


.banner {
display: none;
}
.banner img { display: block;}

nav ul {
display: flex;
flex-wrap: nowrap;
align-content: space-between;
width: auto;
height: auto;
margin: 0 auto 0;
}

nav ul li {
width: 100%;
justify-content: center;
}
nav ul li img {
width: 70%;
justify-content: center;
}

/*-------------------------------------------
main
-------------------------------------------*/
.firstview { display: block;}
.firstview figure {
width: 50%;
margin: 0 auto 0;
}
.firstview article {
color: #fff;
text-align: center;
}
/* サイトロゴ */
h1.sitelogo > img { display: block; margin-bottom: 50px;}

.profile {
padding: 100px 0;
background-image: url(../img/line_circle_small.webp), url(../img/line_circle_small.webp);
background-position: center top, center bottom;
background-repeat: repeat-x, repeat-x;
background-size: 100%, 100%;
}
h1.tit_prof > img { display: block; width: 30%; margin: 0 auto 50px;}
.prof-center {
background: transparent;
}
.prof-inner {
text-align: center;
color: #fff;
margin:0 0;
padding: 0 5%;
}

.flex main {
padding: 40px 5% 0 5%;
/* flex-grow（今回は全体幅に対し1:4とする）、flex-shrink（1:1ナビとメインコンテンツを同じ割合で縮小する。縮小したくない時は0とすること）、flex-basis（アイテムの大きさを指定する） */
flex: 4 1 80%;
background-image: url(../img/header_rose_small.webp);
background-position: right top;
background-repeat: repeat-x;
box-shadow: inset 0 10px 25px 0 rgba(0, 0, 0, 1.0);
}

/* 飾り枠 */
article.frame_pink {
width: 94%;
margin: 0 auto 0;}

h1.news > img { display: block; width: 100px; margin: 0 auto 0;}

.frame_pink dl {padding: 2% 0% 5% 0%;}
.frame_pink dt {padding-bottom: 1%; margin-bottom:0.5em;}
.frame_pink dd {margin-top: 0em; margin-bottom:2em; padding-left: 0em;}
/* 飾り枠　ここまで */

.flex { flex-direction: column;}
#footer > div.waku, #footer .inner, .flex header, .flex main {width: 100%;}
#footer > div.waku { display: none;}

}