@charset "utf-8";
html {
  --14px: 0.875rem;
  --15px: 0.9375rem;
  --16px: 1rem;
  --17px: 1.0625rem;
  --18px: 1.125rem;
  --19px: 1.1875rem;
  --20px: 1.25rem;
  --21px: 1.3125rem;
}
img {max-width: 100%;}
ul { list-style: none;}
a { color: #E52689;}
body {
background-image: url(../img/bg_dot.png);
background-repeat: repeat;
font-size: var(--17px);}
.flex {
display: flex;
flex: 1;
/* background-color: #ee0; */
flex-wrap: wrap;
}
/* スマホとPAD用 */
@media screen and (min-width: 768px) {
.sp { display: none;}
}
/*-------------------------------------------
navi
-------------------------------------------*/
.flex header {
/* background-color: hotpink; */
background-color:  #222;
/* flex-grow（今回は全体幅に対し1:4とする）、flex-shrink（1:1ナビとメインコンテンツを同じ割合で縮小する。縮小したくない時は0とすること）、flex-basis（アイテムの大きさを指定する） */
flex: 1 1 20%;
background-image:url(../img/f-migi_long.gif);
background-position:top right;
background-repeat:repeat-y;
}

.flex header > .box-center {
background-image:url(../img/f-migi.gif);
background-position:top right;
background-repeat:repeat-y;
}
.flex header > .box-center > .box-inner {
background:#fff;
margin:0 67px 0 0;
padding: 50px 0 0 5%;
}
.banner {
width: 41px;
margin: 100px auto 0;
}
.banner img { display: block;}

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

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




/*-------------------------------------------
main
-------------------------------------------*/
.firstview { display: flex;
flex: 1;
flex-wrap: wrap;
flex-direction:row-reverse;}
.firstview figure {
flex: 2 1 40%;
}
.firstview article {
flex: 3 1 60%;
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-image:url(../img/ind_prof_right.webp), url(../img/ind_prof_left.webp);
background-position:center right, center left;
background-repeat:no-repeat, no-repeat;
background-size: 150px, 150px;
}
.prof-inner {
text-align: center;
color: #fff;
margin:0 200px;
}


.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;
}


h1 { font-size: var(--21px);}
p { font-size: var(--18px); line-height: 1.8; padding-bottom: 1rem;}

/* 飾り枠ここから */
h1.news > img { display: block; width: 150px; margin: 0 auto 0;}


article.frame_pink {
width: 75%;
margin: 0 auto 0;}

.box17 {
margin:1em auto;
width:100%;
}
.u01 {
background:url(../img/f-ue.gif) repeat-x;
height:67px;
margin:0 67px;
}
.s01 {
background:url(../img/f-sita.gif) repeat-x;
height:67px;
margin:0 67px;
}
.box-top {
background-image:url(../img/f-kado1.gif), url(../img/f-kado2.gif);
background-position:top left, top right;
background-repeat:no-repeat, no-repeat;
height:67px;
}
.box-center {
background-image:url(../img/f-migi.gif), url(../img/f-hidari.gif);
background-position:top right, top left;
background-repeat:repeat-y, repeat-y;
}
.box-inner {
background:#fff;
margin:0 67px;
}
.box-bottom {
background-image:url(../img/f-kado3.gif), url(../img/f-kado4.gif);
background-position:top left, top right;
background-repeat:no-repeat, no-repeat;
height:67px;
}

.frame_pink dl {padding: 2% 5% 5% 5%;}
.frame_pink dt {padding-bottom: 1%; margin-bottom:2em;}
.frame_pink dd {margin-top: -3.5em; margin-bottom:2em; padding-left: 10em;}

.new::before {
    content: url(../img/zh18-icon-new.gif);
    display: block;
}

body, .font-w4 {
  font-family: "DotGothic16", serif;
  font-weight: 400;
  font-style: normal;
}

.font-w5 {
  font-family: "DotGothic16", serif;
  font-weight: 500;
  font-style: normal;
}

.font-w7 {
  font-family: "DotGothic16", serif;
  font-weight: 700;
  font-style: normal;
}
/* 飾り枠ここまで */


/*-------------------------------------------
Footer
-------------------------------------------*/
#footer {
font-size: var(--16px);
text-align: center;
color: #fff;
padding-bottom: 50px;
display: flex;
flex: 1;
/* background-color: #ee0; */
background-image: url(../img/bg_dot.png);
background-repeat: repeat;
flex-wrap: wrap;
}
#footer > div.waku {
width: 20%;
/* background-color: hotpink; */
background-image: url(../img/bg_dot.png);
background-repeat: repeat;
flex: 1 1 20%;
}

#footer > div.waku .s01 {
background:url(../img/f-sita.gif) repeat-x;
height:67px;
margin:0 67px 0 0;
}

#footer > div.waku .box-inner {
background:#fff;
margin:0 67px;
}
#footer > div.waku .box-bottom {
background-image:url(../img/f-kado4.gif);
background-position:top right;
background-repeat:no-repeat;
height:67px;
}

#footer .inner {
flex: 4 1 80%;
}
#footer .sns {
  display: flex;
  justify-content: center;
margin-bottom: 20px;
}
#footer .sns li {
  margin: 0 10px;
}