@charset "utf-8";

@font-face {
    font-family: 'Tegaki';
    src : url(font/KTEGAKI.ttf);
}

body
{
    font-family: "Helvetica Neue",
        Arial,
        "Hiragino Kaku Gothic ProN",
        "Hiragino Sans",
        Meiryo,
        sans-serif;
    font-size:20px;
    line-height:38px;
    color:#454;
}

.fs24{font-size:24px;}

.bg1,.bg10
{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-repeat: repeat;
    background-position-y:0;
}
.bg10
{
    z-index:-1;
    background-image:url("images/bg02b.png");
    opacity: 0.1;
}
.bg1
{
    z-index:-2;
    background-image:url("images/bg14.png");
}
.bg10_2b
{
    z-index:-1;
    background-image:url("images/bg02b.png");
    opacity: 0.1;
}
.bg1_2b
{
    z-index:-2;
    background-image:url("images/bg13b.png");

}


a {
    color:#5af;
}
a:hover {
    color: #f73;
    text-decoration: underline;
}

.ha,.ha:hover
{
    color:#fff;
    text-decoration: none;
}

.tegaki {
    font-family: Tegaki;
    line-height:36px;
}
.whitebox
{
    background-color: rgba(255,255,255,0.4);
    border-radius: 20px;
    padding:20px;

    text-shadow:
        2px 2px 0 #fff,
        -2px 2px 0 #fff,
        -2px -2px 0 #fff,
        2px -2px 0 #fff;
}

/* */

.center,.center2 {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}
.mt4 {margin-top:4px;}
.mt8 {margin-top:8px;}
.mt20 {margin-top:20px;}
.mt40 {margin-top:40px;}
.mt60 {margin-top:60px;}
.mt80 {margin-top:80px;}
.mt120 {margin-top:120px;}
.mr10  {margin-right:10px;}

/* */

.main_cont {
    width:896px;
    margin:0 auto;
    padding:0px 0;
    /*
    -background-color:#ffffff;
    -background-color:rgba(255,255,255,0.8);
    */
}

.logo
{
    width:220px;
    margin-left:10px;
}

.titlehead
{
    width:896px;
    height:384px;
    border-bottom:4px solid #cdf;
}

.titlehead2
{
    width:100%;
    text-align:center;
    max-width:1200px;
    z-index: 4;
}

.header2
{
    width:100%;
    max-width:1600px;
    margin:0 auto;
    padding:0px 0;
    background-image:url("images/logo_15b_600.png");
    background-repeat: no-repeat;
    background-size:50%;
    background-position: center center;
}
.header2_2b
{
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding:0px 0;
}
@media screen and (min-width:1000px){
    .header2
    {
        background-size:560px;
    }
}

.vid
{
    border-top:2px solid #5af;
    border-bottom:4px solid #5af;
    width:100%;
    z-index:20;
}

.start
{
    color:#555;
    font-weight:bold;
    font-size:20px;
    line-height:22px;
    padding:0 20px;
}
.start2
{
    text-align:center;
    color:#fff;
    background-color:#b55;
    font-size:30px;
    font-weight:bold;
    padding:3px 20px;
    border-radius: 8px;
    border-bottom:4px solid #b88;
    border-right:4px solid #b88;
}

.img896
{
    width:100%;
    max-width:896px;
}
.bhead01
{
    width:100%;
    height:52px;
    margin:0 auto;
    padding:0px 0;
    background-color:#aaf;
}
.blabel01
{
    position: relative;
	padding: 4px 20px 4px 64px;
	background: #88f;
	z-index:1;
    font-size:32px;
    line-height:36px;
	color:#fff;
}
.blabel01:before
{
    position: absolute;
	content: '';
	left: 0px;
	top: 0px;
	width: 0;
	height: 0;
	border-left: solid 40px #aaf;
	border-bottom: solid 50px transparent;
	z-index: 2;
}
.blabel01:after 
{
    position: absolute;
	content: '';
	right: 0px;
	top: 0px;
	width: 0;
	height: 0;
	border-left: solid 40px transparent;
	border-bottom: solid 50px #aaf;
	z-index: 2;
}

.flex
{
    display:flex;
    justify-content: space-between;
}
.flex2,.flex3
{
    display:flex;
}

@keyframes fadep {
    0% { opacity: 0; }
    100% { opacity: 1; }
}


.prof1,.prof1z {width:45%;}
.prof1p
{
    width:100%;
    max-width:795px;
    opacity: 0;
    animation:fadep 3s ease-in-out .5s 1 normal forwards;
}
.prof1x{width:4%;}
.prof2 {
    width:64%;
    max-width: 480px;
    display:grid;
    grid-template-rows: 40% 60%;
    grid-template-columns: 100%;
}
.prof2p
{
    width:100%;
    max-width:460px;
    opacity: 0;
    animation:fadep 3s ease-in-out 1s 1 normal forwards;
}
.prof2t
{
    vertical-align: bottom;
    grid-row: 1;
    grid-column: 1;
}
.prof2b
{
    margin-left:29%;
    grid-row: 2;
    grid-column: 1;
    position:relative;
    text-align:right;
}
.prof2b2
{
    position:absolute;
    bottom:20px;
}
.flexpic
{
    width:40%;
    border-top:2px solid #ccc;
    border-left:2px solid #ccc;
    border-right:2px solid #ccf;
    border-bottom:2px solid #ccf;
}
.news1
{
    flex:1;
    padding:0 20px;
    font-size:16px;
    line-height: 20px;
}
.news1t
{
    color:#57f;
}
.news1p
{
    padding-left:20px;
    padding-bottom:8px;
    border-bottom:2px solid #ccc;
    margin-bottom:8px;
    margin-top:4px;
}
.news2
{
    width: 360px;
    height:600px;
    margin:0 auto;
}

.links
{
    width:auto;
    border:1px solid #555;
}

.m_head
{
    line-height:14px;
    width:100%;
    height:26px;
    background-color:#aaf;
}
.m_head2,.m_foot2
{
    width:896px;
    text-align:left;
    margin:auto;
    font-size:16px;
    color:#fff;
    padding:6px 0;
}
.m_head2
{
    text-align:left;
}
.m_foot2
{
    text-align:center;
}


.mizuse
{
    width:100%;
    background-image:url(images/prof_mizuse_896w.png);
    background-size:cover;
}
.mizuse2
{
    width:100%;
    background-image:url(images/prof_mizuse_896w2.png);
    background-size:cover;
}
.yokugutsu
{
    width:100%;
    background-image:url(images/prof_yokugutsu_896w.png);
    background-size:cover;
}
.yukemuri
{
    width:100%;
    background-image:url(images/prof_yukemuri_896w.png);
    background-size:cover;
}
.meimeianmi
{
    width:100%;
    background-image:url(images/prof_meimeianmi_896w3.png);
    background-size:cover;
}
.nekotsubo
{
    width:100%;
    background-image:url(images/prof_nekotsubo_896w3.png);
    background-size:cover;
}
.miyanohara
{
    width:100%;
    background-image:url(images/prof_miyanohara_896w3.png);
    background-size:cover;
}
.minamo
{
    width:100%;
    background-image:url(images/prof_minamo_896w.png);
    background-size:cover;
}

.line01 {
    width:338px;
    height:20px;
    margin:0 0;
    margin-top:0px;
    margin-bottom:10px;
    background-image:url("images/line01a.png");
}

.pwhite {
    background-color:rgba(255,255,255,0.7);
    border-radius: 10px;
    padding-right:12px;
}

.setumei,.setumei2 {
    text-align:left;
    font-size:44px;
    font-weight:bold;
    color:#F68;
    padding:0 12px 6px 8px; 
    border-bottom:5px solid #f68;
}
.setumei2
{
    font-size:30px;
}


.oubo {
    width:100%;
    padding-bottom:10px;
    margin-bottom:14px;
    border-bottom:2px solid #8af;
    font-size:30px;
    font-weight:bold;
    color:#57f;
}
.chuui {
    width:100%;
    margin:0 auto;
    color:#f77;
    font-size:30px;
}


.sbox
{
    background-color:rgba(255,255,255,0.8);
    border-radius:8px;
    padding:22px;
    vertical-align:middle;
    text-align:left;

    border-top   :1px solid #def;
    border-left  :2px solid #def;
    border-right :3px solid #cdf;
    border-bottom:4px solid #cdf;
}

.sbw560,.sbw600,.sbw620,.sbw640,.sbw680,.sbw740,.sbw800 {
    width:100%;
    margin:0 0;
}

.sbw560 {
    width:560px;
    margin-left:168px;
}
.sbw600 {
    width:600px;
    margin-left:148px;
}
.sbw620 {
    width:620px;
    margin-left:138px;
}
.sbw640 {
    width:640px;
    margin-left:128px;
}
.sbw680 {
    width:680px;
    margin-left:108px;
}
.sbw740 {
    width:740px;
    margin-left:78px;
}
.sbw800 {
    width:800px;
    margin-left:48px;
}
.pcmargin40
{
    margin-left:40px;
}



/* */

.fadein {
    animation-name:fadeina;
    animation-duration:5s;
    animation-fill-mode:forwards;
    opacity:0;
}


/* グッズ用 */

.items
{
    display:flex;
    flex-wrap:wrap;
    align-items: start;
}

.item
{
    width:292px;
    height:388px;
    padding:4px;
    margin-right:6px;
    margin-bottom:12px;
    background-color:#ffffff;
    border:2px solid #ccf;
    border-radius: 8px;
}

.item0
{
    max-width:280px;
    max-height:300px;
}
.item1,.item2,.item3
{
    font-size:16px;
    line-height:20px;
    padding-left:8px;
}

.item1
{
    color:#888;
    font-size:14px;
    text-decoration:none;
}
.item2
{
    color:#444;
}
.item3
{
    color:#faa;
}


.item:hover
{
    border:2px solid #f77;
    cursor:pointer;
}


.iprof
{
    width:210px;
    height:320px;
    padding:4px;
    margin-right:12px;
    margin-bottom:12px;
    background-color:#ffffff;
    border:4px solid #fcfcfc;
    border-radius: 8px;
    text-align:center;
}

.iprof0
{
    width:180px;
    max-width:240px;
    max-height:300px;
}

.iprof1,iprof2
{
    color:#666;
    font-size:24px;
    line-height:14px;
    text-decoration:none;
}
.iprof1{margin-top:12px;}
.iprof2{color:#f88;}
.iprof:hover
{
    background-color:#efefef;
    border:4px solid #cdf;
    cursor:pointer;
}

/* メニュー関連 */

nav
{
    display:block;
    position:fixed;
    top:34px;
    right:40px;
    z-index: 100;
}

.pcmenu
{
    padding:0px 10px;
    background-color:rgba(255,255,255,0.9);
    text-shadow: #FFF 0 0 20px;
    border-top:1px solid #aae;
    border-left:1px solid #aae;
    border-right:2px solid #99c;
    border-bottom:2px solid #99c;
    border-radius: 8px;
    font-weight:bold;
    border-color:#99C;
}
.pcmenu ul
{
    font-size:14px;
    font-weight:bold;
}
.pcmenu ul li
{
    list-style:none;
    display:inline-block;
    padding:0 6px;
}
.pcmenu ul li a
{
    text-decoration:under;
    color:#99C;
}
.pcmenu ul li a:hover
{
    text-decoration:underline;
    color: #f73;
}

/* ハンバーガーメニュー */

.humbw{display:none;}
.smenu{display:none;}
.smenu2{display:none;}

/* フォーム関連 */




/* フェードイン アニメーション */

@keyframes fadeina{
  from {opacity: 0;}
  to {opacity: 1;}
}

.fadeset {
    opacity:0;
}

.fadein01,.fadein02,.fadein03 {
    animation-duration:2s;
    animation-fill-mode:forwards;
    opacity:0;
}
.fadein01 {
    animation-name:fadein01a;
}
.fadein02 {
    animation-name:fadein02a;
}
.fadein03 {
    animation-name:fadein03a;
}
@keyframes fadein01a{
    from {
        opacity:0;
        transform:translateY(100px);
    }
    to {
        opacity:1;
        transform:translateY(0);
    }
}
@keyframes fadein02a{
    from {
        opacity:0;
        transform:translateX(100px);

    }
    to {
        opacity:1;
        transform:translateX(0);
    }
}
@keyframes fadein03a{
    from {
        opacity:0;
        transform:translateX(-100px);
    }
    to {
        opacity:1;
        transform:translateX(0);
    }
}
@keyframes fadein04a{
    from {
        opacity:0;
        transform:translateY(10px);
    }
    to {
        opacity:1;
        transform:translateY(0);
    }
}

/* */

.btn {
    position:relative;
    width:640px;
    margin:0 auto;
    font-size: 32px;
    padding: 12px 20px;
    transition: all 0.4s;
    text-align: center;

    border-radius: 20px;
    font-weight:bold;
    color:#fff;
    background-color:#b55;
}
.btn:hover {
    background-color:#f88;
}

.btn:before,.btn:after {
  position: absolute;
  left: 0;
  width: 100%;
  content: '';
  transition: all .3s;
  border-top: 3px dotted #fff;
}
.btn:before {
  top: 4px;
}
.btn:after {
  bottom: 4px;
}
.btn:hover:before {
  top: -3px;
}
.btn:hover:after {
  bottom: -3px;
}

.bt46
{
    width:46px;
    height:auto;
}

.gmap
{
    position:relative;
    width:100%;
    height:0;
    padding-top:75%;
}
.gmap iframe
{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}


.pinf{
    font-size:14px;
    line-height:24px;
    border:1px solid #888;
    padding:24px;
    border-radius: 4px;
}

/* ********************************************************************
  スマホ用
 ******************************************************************** */

.pc {display:block;}
.smaho {display:none;}

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


.pc {
    /* 何故か表示されてしまう */
    display:none;
    /* opacity 0でごまかす */
    opacity:0;
    pointer-events: none;
};
.smaho {display:block;}

body {
    font-size: clamp(12px, 2.4vw, 21px);
    line-height:26px;
}
.main_cont
{
    width:100%;
    padding:0 0px;
}
.titlehead
{
    width:100%;
    height:auto;
}
.m_head2,.m_foot2
{
    width:100%;
    padding-left:4px;
    text-align:left;
    font-size: clamp(12px, 2.6vw, 16px);
}

.pcmenu
{
    display:none;
}
.sbw560,.sbw600,.sbw620,.sbw640,.sbw680,.sbw740,.sbw800 {
    width:100%;
    margin:0 0;
}

.setumei {
    font-size: clamp(30px, 4vw, 40px);
}
.oubo,.setumei2 {
    font-size: clamp(22px, 3.4vw, 36px);
}
.chuuim,.btn {
    font-size: clamp(18px, 3vw, 30px);
}

.chara {
    width:100%;
    height:auto;
    aspect-ratio:700/460;
}
.bhead01
{
    height:clamp(14px, 2.7vw, 26px);
}
.blabel01:before{
    border-left:clamp(14px, 2.7vw, 26px);
}
.blabel01:after{
    border-bottom:clamp(14px, 2.7vw, 26px);
}
.charatext ,.blabel01{
    font-size: clamp(14px, 2.7vw, 26px);
    line-height: clamp(14px, 2.7vw, 26px);
    bottom:25%;
}

.btn
{
    width:80%;
    font-size: clamp(22px, 3.4vw, 26px);
}

.flex2
{
    display:block;
}
.prof1z
{
    width:100%;
}

.p
{
margin:0;
}

.start
{
    font-size: clamp(14px, 2.6vw, 21px);
}
.start2
{
    font-size: clamp(18px, 3vw, 30px);
}

.fadein02,.fadein03
{
    animation-name:fadein04a;
}
.fadein03
{
    animation-name:fadein04a;
}
.news2
{
    height:0;
}
.bt46
{
    width:24px;
}
.sbox
{
    line-height:4vw;
}

/* スマホ用メニュー */
nav
{
    pointer-events: none;
    display:block;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.smenu
{
    pointer-events: auto;
    display:none;
    background-color:rgba(255,255,255,0.8);
    border-left:4px solid #558;
    width:80%;
    height:100%;
    margin-left:20%;
}
.smenu2
{
    display:block;
    width:100%;
    padding:80px 0 0 40px;
}

.smenu2 ul
{
    font-size:5vw;
    line-height:10vw;
}
.smenu2 ul a
{
    color:#558;
    border-bottom:3px solid #558;
}

/* ハンバーガーメニュー */

.humbw
{
    pointer-events: auto;
    display:block;
    position:fixed;
    right:24px;
    top:4px;
    z-index: 1000;
}
.humb
{
    position: relative;
    width: 50px;
    height:50px;

}

.humb span
{
    display: inline-block;
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 4px;
    background: #55f;
    width: 80%;
    transition: all .4s;
    font-weight: bold;
    font-size: 14px;
}

.humb span:nth-of-type(1){top:13px;}
.humb span:nth-of-type(2){top:19px;}
.humb span:nth-of-type(3){top:25px;}
.humb span:nth-of-type(3)::after
{
  content:"Menu";
  position: absolute;
  top:2px;
  left:-1px;
  color: #55f;
  text-transform: uppercase;
}

.humb.active span:nth-of-type(1)
{
    top: 14px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 60%;
}
.humb.active span:nth-of-type(2){ opacity: 0;}
.humb.active span:nth-of-type(3)
{
    top: 26px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 60%;
}
.humb.active span:nth-of-type(3)::after
{
    content:"Close";
    transform: translateY(0) rotate(-45deg);
    top:2px;
    left:6px;
}

.zzp{max-width:94%;margin:0 auto;}
.pd
{
padding-right:2%;
padding-left:2%;
}


.center2
{
    text-align: left;
}

.spcut
{
    display:none;
}

}/* media screen end*/