@charset "utf-8";
@media screen and (min-width:768px){
/*▼ヘッダー▼*/
header{
padding:15px 0;
background:#fa7093;
position:relative;
z-index:10;
}
header h1{
color:#fff;
font-size:20px;
font-weight:bold;
text-align:center;
line-height:1.9;
background:url(../img/h_bg.png) center 50% no-repeat;
}
header h1 span{
font-size:30px;
margin-right:10px;
}
header a{
display:inline-block;
color:#fff;
text-decoration:none;
}
nav{
display:none;
background:#ffa0b9;
position:absolute;
right:0;
top:50%;
opacity:0.9;
overflow:hidden;
width:350px;
}
nav li a{
padding:15px 20px;
display:block;
}
nav li a:hover{
background:#ffbdce;
}
main h2{
color:#555;
font-size:36px;
font-weight:bold;
text-align:center;
line-height:1.8;
margin-bottom:40px;
background:url(../img/h_bg3.png) center 50% no-repeat;
}
.introduction{
color:#999;
text-align:center;
margin-bottom:45px;
}
/*▼20150915高田▼*/
.nav_btn{
display: inline-block;
position: absolute;
right:2%;
top:50%;
margin-top:-30px;
width: 60px;
height: 60px;
border-radius: 3px;
background: #fa7093;
cursor:pointer;
}
.nav_btn span{
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 46px;
height: 4px;
margin: -2px 0 0 -23px;
background: #fff;
transition: .2s;
}
.nav_btn span:before, .nav_btn span:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 0;
width: 46px;
height: 4px;
background: #fff;
transition: .3s;
}
.nav_btn span:before{
margin-top: -18px;
}
.nav_btn span:after{
margin-top: 15px;
}
.nav_btn .close{
background: transparent;
}
.nav_btn .close:before, .nav_btn .close:after{
margin-top: 0;
}
.nav_btn .close:before{
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.nav_btn .close:after{
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
}
/*▲20150915高田▲*/
/*▲ヘッダー▲*/
/*▼フッター▼*/
footer small{
display:block;
color:#888;
text-align:center;
padding:40px 0;
}
/*▲フッター▲*/
/*▼固定メニュー▼*/
.menu_btn::selection,.menu_btn span::selection,.menu_list::selection,.menu_list li::selection,.menu_list a::selection{
background:none;
}
.fix_slide{
position:fixed;
z-index:10;
right:2%;
bottom:5%;
width:250px;
}
.menu_btn{
display: inline-block;
position: absolute;
right:0;
bottom:0;
width: 60px;
height: 60px;
border-radius: 3px;
background: #ffa0b9;
cursor:pointer;
}
.menu_btn:hover{
background: #ffa0b9;
opacity:0.8;
}
.menu_btn span{
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 32px;
height: 2px;
margin: -1px 0 0 -16px;
background: #fff;
transition: .2s;
}
.menu_btn span:before, .menu_btn span:after{
display: block;
content: "";
position: absolute;
top: 50%;
left: 0;
width: 32px;
height: 2px;
background: #fff;
transition: .3s;
}
.menu_btn span:before{
margin-top: -10px;
}
.menu_btn span:after{
margin-top: 8px;
}
.menu_btn .close{
background: transparent;
}
.fix_slide .menu_btn.bd_none{
border-bottom-left-radius:0;
border-top-left-radius:0;
}
.menu_btn .close:before, .menu_btn .close:after{
margin-top: 0;
}
.menu_btn .close:before{
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.menu_btn .close:after{
transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
}
.menu_list{
background:#ffa0b9;
position:absolute;
left:-30px;
bottom:0;
display:none;
width:250px;
}
.menu_list li{
list-style-type: none;
}
.menu_list li:hover{
background:#ffbdce;
}
.menu_list li a{
color:#fff;
text-decoration:none;
display:block;
padding:10px;
}
/*▲固定メニュー▲*/
/*▼トップページ▼*/
/*main{
background:url(../img/key_visual.png) center top no-repeat;
background-size:contain;
padding-top:54%;
}*/
.urumi{
color:#727272;
/*background-color:rgba(243,243,243,0.8);*/
background:#f7f7f7;
padding:80px 18%;
position:relative;
box-shadow:rgb(227, 228, 230) 0 0 8px 1px inset;
}
.urumi .maid{
font-size:20px;
font-weight:bold;
margin:40px auto 3px;
}
.urumi p{
line-height:1.7;
width:75%;
margin:0 auto;
}
.urumi section p{
width:auto;
margin:0 0 45px 0;
}
.hash{
position:relative;
width:440px;
margin:0 auto;
z-index:2;
margin-top:-126px;
text-align:center;
}
.hash li{
display:inline-block;
font-size:14px;
width:10em;
}
.hash a{
display:block;
color:#999;
text-decoration:none;
}
.hash a:hover{
color:#bbb;
}
.hash img{
width:65%;
margin:0 auto 15px;
}
#profile{
padding-top:50px;
}
#profile h3{
color:#00b8e5;
font-size:36px;
font-weight:bold;
text-align:center;
line-height:1.8;
margin-bottom:40px;
background:url(../img/h_bg1.png) center 50% no-repeat;
}
#profile ol{
width:80%;
margin:0 auto 30px;
}
#profile ol li{
list-style-type:decimal;
list-style-position:outside;
margin-bottom:7px;
}
#profile ol li:nth-child(n+6){
font-weight:bold;
}
.urumi .pro_radio{
color:#999;
font-size:14px;
line-height:1.5;
width:70%;
margin:0 auto 30px;
}
.external{
overflow:hidden;
width:490px;
margin:0 auto 30px;
}
.external li{
float:left;
}
.external li:first-child{
width:100%;
margin-bottom:20px;
}
.external li:nth-child(n+2){
width:150px;
}
.external li:nth-child(2){
clear:both;
}
.external li:nth-child(3){
margin:0 20px;
}
.external a{
display:block;
color:#fff;
font-size:14px;
font-weight:bold;
text-align:center;
background:#2ec1e5 url(../img/link_bg.png) 95% 50% no-repeat;
background-size:17px;
border-radius:3px;
}
.external a:hover{
background:#30ccf3 url(../img/link_bg.png) 95% 50% no-repeat;
background-size:17px;
}
.external li:first-child a{
background:#2ec1e5 url(../img/link_bg.png) 98% 50% no-repeat;
background-size:17px;
}
.external li:first-child a:hover{
background:#30ccf3 url(../img/link_bg.png) 98% 50% no-repeat;
background-size:17px;
}
.urumi .pro_immunity{
color:#999;
font-size:10px;
width:83%;
margin:0 auto 50px;
}
#profile dl{
padding-bottom:80px;
background:url(../img/profile_bg.png) right top no-repeat;
background-size:33%;
}
#profile dt,
#evolution dt{
margin-bottom:5px;
}
#profile li span,
#evolution li span{
font-weight:bold;
}
#profile dd,
#evolution dd{
margin-bottom:20px;
}
.apec li{
margin-bottom:7px;
}
.sound {
overflow:hidden;
}
.sound li{
float:left;
margin-right:15px;
margin-bottom:15px;
background:#ff9eb6 url(../img/sound_icon.png) 10% 50% no-repeat;
padding-left:37px;
background-size:13px;
border-radius:3px;
}
.pc_clear{
clear:both;
}
.sound button{
display:block;
color:#fff;
font-size:16px;
font-weight:bold;
padding:8px 20px;
border-left:solid 1px #ffcfdb;
}
.sound button:hover{
cursor:pointer;
background:#ffb6c3;
border-radius:0 3px 3px 0;
}
#evolution{
overflow:hidden;
}
#evolution h3{
color:#00b8e5;
font-size:36px;
font-weight:bold;
text-align:center;
line-height:1.8;
margin-bottom:40px;
background:url(../img/h_bg4.png) center 50% no-repeat;
}
#evolution h3 span{
color:#f69679;
font-size:46px;
}
#evolution dl{
float:right;
background:url(../img/evolution_bg.png) left top no-repeat;
background-size:34%;
padding-left:53%;
}
#evolution .sound li{
color:#fff;
font-size:16px;
font-weight:bold;
background:#ccc;
padding:5px 30px;
}
#evolution .introduction span{
display:inline-block;
}
#announcement{
padding-top:80px;
/*background-color:rgba(255,255,255,0.8);*/
}
#announcement h2,
#contact h2{
color:#ff8ca9;
background:url(../img/h_bg2.png) center 50% no-repeat;
}
.announcement_p{
text-align:center;
margin-bottom:60px;
}
#announcement ul{
width:75%;
margin:0 auto;
}
#announcement li,
#wallpaper li{
margin-bottom:50px;
overflow:hidden;
}
#announcement li,
.announcement_contest a{
padding:3%;
}
#announcement .announcement_contest{
padding:0;
}
#announcement .announcement_contest a{
float:none;
width:auto;
display:block;
margin:0;
background:#faf2f3;
border-radius:8px;
overflow:hidden;
}
#announcement .announcement_contest a:hover{
background:#fffafa;
}
.announcement_contest img{
width:35%;
float:left;
margin-right:6%;
}
.announcement_contest h3{
font-weight:bold;
}
#announcement a,
#announcement div{
float:left;
}
#announcement a{
width:35%;
margin-right:6%;
}
#announcement div{
width:59%;
}
#announcement h3{
color:#727272;
font-size:26px;
margin-bottom:8px;
}
#announcement span{
display:block;
color:#00b8e6;
font-size:20px;
margin-bottom:8px;
}
#announcement time{
color:#a0a0a0;
font-size:14px;
margin-bottom:8px;
}
#announcement p{
color:#888;
}
#painter{
padding:50px;
margin-bottom:80px;
}
#painter .introduction span{
display:block;
margin-top:10px;
}
#painter ul{
width:90%;
margin:0 auto 150px;
overflow:hidden;
}
#painter li{
float:left;
}
.painter_sora{
width:60%;
margin:0 0 60px 21%;
text-align:right;
}
.painter_sora a{
color:#fff;
text-decoration:none;
}
.painter_sora a span{
display:inline-block;
font-size:14px;
border:solid 1px #0cbbe7;
background:#01b8e6 url(../img/sora_bg.png) left top repeat-x;
border-radius:3px;
padding:4px 12px;
margin-top:15px;
}
.painter_moda{
clear:both;
width:47%;
}
.painter_kiriko{
float:right;
width:53%;
}
.painter2{
width:95%;
margin:0 auto;
}
.top_bg{
padding:80px 0;
background:#f7f7f7;
box-shadow:rgb(227, 228, 230) 0 0 8px 1px inset;
}
#gallery,
#anniversary{
padding-top:50px;
}
#gallery ul{
overflow:hidden;
width:90%;
margin:0 auto 50px;
}
#gallery li{
float:left;
width:19%;
margin:0 0.5% 1% 0.5%;
z-index:0;
position:relative;
}
#gallery li a{
width:auto;
margin:0;
}
#gallery li a img{
border-radius:5px;
}
#gallery a{
display:block;
width:20%;
margin:0 auto;
}
#illustrator,
#creation{
padding-top:50px;
margin-top:-50px;
}
#illustrator ul{
overflow:hidden;
width:64%;
margin:0 auto;
}
#illustrator li{
float:left;
text-align:center;
width:22%;
margin:0 1.5% 50px 1.5%;
}
.pc_clear{
clear:both;
}
#illustrator figure img{
margin-bottom:15px;
}
#illustrator figcaption{
color:#7b8998;
font-size:12px;
margin-bottom:5px;
}
#illustrator figcaption span{
display:block;
}
#illustrator li p{
color:#3dc6e9;
font-size:16px;
font-weight:bold;
margin-bottom:10px;
}
#illustrator li .tuu_none{
font-size:14px;
}
#illustrator li p a{
color:#3dc6e9;
text-decoration:none;
margin:0;
}
#illustrator li p a:hover{
color:#6ad4ef;
}
#illustrator li a{
display:inline-block;
vertical-align:middle;
margin:0 1%;
}
#illustrator li a img{
margin:0;
}
#illustrator .hp{
color:#fff;
font-size:12px;
font-weight:bold;
text-decoration:none;
background:#17bce6;
border-radius:3px;
padding:3px 18px;
}
#illustrator .hp:hover{
background:#3accf1;
}
#illustrator figure .tuu_none{
font-size:10px;
margin:0;
}
#wallpaper{
padding:80px 0;
}
#wallpaper ul{
width:64%;
margin:0 auto;
}
#wallpaper li{
padding-bottom:50px;
border-bottom:solid 1px #ccc;
}
#wallpaper .bor_no{
border:none;
margin:0;
padding:0;
}
#wallpaper img,
#wallpaper section{
float:left
}
#wallpaper img{
width:54%;
margin-right:5%;
}
#wallpaper section{
width:41%;
margin-top:10px;
}
#wallpaper h3{
color:#737373;
font-size:14px;
font-weight:bold;
margin-bottom:15px;
background:url(../img/download_bg1.png) left 0.3em no-repeat;
padding-left:14px;
}
#wallpaper section p{
color:#00b8e6;
font-size:14px;
font-weight:bold;
margin-bottom:10px;
overflow:hidden;
}
#wallpaper span{
float:left;
margin-top:5px;
background:url(../img/download_bg2.png) left 0.3em no-repeat;
padding-left:14px;
}
#wallpaper a{
float:right;
color:#fff;
text-decoration:none;
background:#ff809f;
border-radius:3px;
padding:5px 10px;
}
#wallpaper a:hover{
background:#ff95af;
}
#creation ul{
color:#727272;
width:70%;
margin:0 auto;
text-align:center;
}
#creation li{
display:inline-block;
text-align:left;
width:47%;
margin:0 0 50px 2%;
vertical-align:top;
}
#creation  .intro_li,
#creation li li{
display:block;
width:auto;
}
#creation h3{
border-bottom:solid 1px #b3b3b3;
margin-bottom:15px;
padding-bottom:15px;
}
#creation li p{
font-size:14px;
line-height:1.8;
}
.intro_li p{
width:78%;
margin-bottom:15px;
}
.intro_p{
font-weight:bold;
}
#creation li ul{
width:auto;
}
#creation li li{
font-size:14px;
margin:0;
line-height:1.8;
background:url(../img/porint.png) left 0.8em no-repeat;
padding-left:10px;
}
#creation .unknown{
color:#727272;
font-size:18px;
text-align:center;
}
#contact{
padding-top:45px;
}
#contact form{
width:40%;
margin:0 auto;
}
#contact li{
position:relative;
margin-bottom:10px;
}
#contact input,
#contact textarea{
width:100%;
border:solid 1px #ccc;
border-radius:5px;
padding:10px 8px;
background:#fff;
box-sizing:border-box;
}
.updnWatermark{
color:#ccc;
top:12px;
left:8px;
}
#contact button{
display:block;
color:#fff;
font-size:22px;
font-weight:bold;
background:#ff8ca9;
border-radius:5px;
padding:10px 0;
width:40%;
margin:0 auto 40px;
}
#contact button:hover{
cursor:pointer;
background:#fea2b9;
}
.caution{
color:#fc658b;
text-align:center;
}
.caution span{
display:block;
}
label.error{
color:#ff6860;
font-size:14px;
}
.error_msg{
color:#ff6860;
font-size:16px;
width:26em;
margin:0 auto 12px;
}
.thanks_text{
color:#999;
text-align:center;
margin:80px 0;
}
#about{
padding:80px 0;
}
#about img{
width:64%;
margin:0 auto 45px;
}
#about ul{
text-align:center;
}
#about li{
display:inline-block;
vertical-align:top;
margin:8px 5px;
width:20%;
}
#about a{
display:block;
color:#fff;
font-size:16px;
font-weight:bold;
text-decoration:none;
background:#ff8ca9;
border-radius:3px;
padding:15px 0;
}
#about a:hover{
background:#fa9fb6;
}
/*▲トップページ▲*/
/*▼イラストコンテスト▼*/
#contest_header h1{
font-size:24px;
padding:6px 0;
background:url(../img/h_bg5.png) center 35% no-repeat;
}
#contest_header h1 span{
font-size:24px;
margin:0;
}
/*#contest_header .nav_btn span{
width:36px;
}
#contest_header .nav_btn span:before,
#contest_header .nav_btn span:after{
width:36px;
}
#contest_header .nav_btn span:before{
margin-top:-14px;
}
#contest_header .nav_btn span:after{
margin-top:11px;
}
#contest_header .nav_btn .close:before,
#contest_header .nav_btn .close:after{
margin-top:0;
}*/
#contest_main{
padding-bottom:100px;
background:#f7f7f7;
}
.contest_hash{
margin:-47px auto 60px;
}
#anniversary{
width:75%;
margin:0 auto;
color:#727272;
}
#anniversary h2{
color:#00b8e5;
font-size:34px;
background:url(../img/h_bg6.png) center center no-repeat;
margin-bottom:60px;
}
#anniversary h2 span{
display:inline-block;
}
#anniversary h3{
font-size:22px;
font-weight:bold;
padding-bottom:10px;
border-bottom:solid 1px #b3b3b3;
margin-bottom:15px;
}
#anniversary section{
width:63%;
margin:70px auto 0;
}
.overview li,
.prize li,
.guidelines p,
.site_posted p,
.site_posted li,
.participation_terms p,
.participation_terms li,
.disclaimer p{
font-size:14px;
}
.overview ol{
counter-reset:num;
}
.overview ol li{
position:relative;
padding-left:20px;
margin-bottom:5px;
}
.overview ol li:before{
counter-increment:num;
content:counter(num);
position:absolute;
left:0;
border:solid 1px #727272;
border-radius:50%;
width:1em;
height:1em;
text-align:center;
line-height:1.2;
}
.overview ol span{
color:#00b8e5;
}
.overview ul{
margin-bottom:30px;
}
.overview ul li,
.guidelines p{
padding-left:15px;
background:url(../img/kome.png) left 0.3em no-repeat;
}
.overview dl{
overflow:hidden;
margin-bottom:30px;
}
.overview dt,
.overview dd,
.guidelines dt,
.guidelines dd{
font-size:14px;
float:left;
margin-bottom:5px;
}
.overview dt,
.guidelines dt{
clear:both;
margin-right:20px;
}
.overview p{
font-size:14px;
font-weight:bold;
margin-bottom:5px;
}
.overview .external{
margin:30px 0 0 0;
}
.overview .external li{
padding:0;
background:none;
}
.overview .external li:first-child{
margin-bottom:10px;
}
.guidelines dl{
overflow:hidden;
}
.guidelines .participation{
margin-bottom:25px;
}
.prize h3,
.prize dt{
color:#fa7d9c;
}
.prize dt{
font-size:14px;
font-weight:bold;
margin-bottom:5px;
}
.prize dd{
margin-bottom:10px;
}
.prize li{
font-weight:bold;
margin-bottom:5px;
}
.prize li span{
margin:0 15px;
}
.site_posted p{
margin-bottom:30px;
}
.site_posted ul{
overflow:hidden;
}
.site_posted li{
float:left;
margin-right:20px;
}
.participation_terms p{
margin-bottom:30px;
}
.participation_terms p,
.participation_terms li,
.disclaimer p{
line-height:1.8;
}
.participation_terms li{
list-style-type:decimal;
list-style-position:outside;
margin-left:25px;
}
.participation_terms li:nth-last-child(3){
margin:30px 0 30px 25px;
}
.participation_terms ul{
margin:20px 0 20px 10px;
}
.participation_terms li li{
list-style-type:none;
list-style-position:inside;
margin:0;
background:url(../img/porint.png) left 0.75em no-repeat;
padding-left:10px;
}
.participation_terms li li:nth-last-child(3){
margin:0;
}
#anniversary #gallery{
width:100%;
margin:70px auto;
}
#anniversary #gallery h2{
color:#555;
background:url(../img/h_bg3.png) center 50% no-repeat;
}
#anniversary #gallery ul{
width:100%;
margin:0;
}
#anniversary #gallery li{
width:32%;
}
#footer_contest{
background:#f7f7f7;
}
/*2016.02.29追加*/
.application_end{
color:#f00;
font-size:32px;
font-weight:bold;
text-align:center;
margin-bottom:10px;
}
.application_end span{
display:block;
}
.committee{
color:#fd4242;
font-size:20px;
text-align:center;
}
/*2016.02.29追加*/
/*▼2016.03.07追加▼*/
.sp{
display:none;
}
#anniversary .result{
width:auto;
}
#anniversary .result h2{
background:none;
width:55%;
margin:0 auto 120px;
}
#anniversary .result section{
width:auto;
overflow:hidden;
margin:0 0 120px 0;
}
#anniversary .result h3{
border:none;
padding:0;
width:45%;
margin:0 auto 50px;
}
.result a{
float:left;
width:60%;
}
.result_council{
float:right;
width:37%;
}
#anniversary .council h2{
margin-bottom:30px;
}
#anniversary .result  .council{
width:80%;
margin:0 auto 120px;
}
.council h2 img{
width:30%;
margin:0 auto;
}
.council p{
line-height:1.6;
}
.council_thank{
margin:25px 0;
}
.council span{
display:block;
text-align:right;
margin-top:40px;
}
/*▲2016.03.07追加▲*/
/*▲イラストコンテスト▲*/
}
@media only screen and (min-width:1163px) and (max-width:1274px){
#wallpaper img{
width:50%;
}
#wallpaper section{
width:45%;
}
}
@media only screen and (min-width:1049px) and (max-width:1162px){
#wallpaper img{
width:45%;
}
#wallpaper section{
width:50%;
}
}
@media only screen and (min-width:768px) and (max-width:1048px){
#profile h3{
font-size:32px;
line-height:2;
}
#anniversary h2{
font-size:30px;
line-height:1.5;
}
#illustrator ul{
width:80%;
}
#wallpaper img{
width:35%;
}
#wallpaper section{
width:60%;
}
#wallpaper h3{
font-size:12px;
background:url(../img/download_bg1.png) left 0.3em no-repeat;
}
#wallpaper section p{
font-size:12px;
}
#wallpaper span{
background:url(../img/download_bg2.png) left 0.3em no-repeat;
}
}
@media only screen and (min-width:1200px) and (max-width:1300px){
#evolution dl{
padding-left:50%;
}
}
@media only screen and (min-width:1091px) and (max-width:1199px){
#evolution dl{
padding-left:44%;
}
}
@media only screen and (min-width:971px) and (max-width:1090px){
#evolution dl{
padding-left:38%;
}
}
@media only screen and (min-width:768px) and (max-width:970px){
#evolution dl{
float:none;
padding:0;
}
.kakuse{
margin-left:44%;
}