@charset "UTF-8";


@media only screen and (max-width:1200px) {
	
	.intro_wrap > img[src*="haku"]{
		right:auto;
		left:calc(50% + 200px);
	}
	
}

@media only screen and (max-width:1050px) {
	.about_dawn::before, .about_dawn::after {width:90px;z-index:-1;}
	
	.sunmoon_form_area::before, .sunmoon_form_area::after {width:90px;z-index:-1;}
	
	.intro_wrap{gap:15px;}
	.intro_inner{width:calc((100% - 15px) / 2);}
	
	.main_sun_signname, .main_moon_signname {font-size:55px;padding-bottom:0;}
}


@media only screen and (max-width:960px) {
	
	.intro_wrap{gap:50px;max-width:700px;}
	.intro_wrap > img[src*="haku"]{
		z-index:2;
		border-radius:42%;
		width:160px;
		top:-110px;
		left:auto;
		right:0;
	}
	.intro_inner{width:100%;padding:20px 60px;}
	
	.result_main_box{max-width:700px;}
	
	.icon_area_side_l,.icon_area_side_r{display:none;}
	
	.grid2{gap:0;}
	.grid2::after{content:none;}
	.grid2_inner{width:100%;}
	.grid2_inner:nth-child(1)::after{
		content:"×";
		width: auto;
		background-image:none;
		font-family: "Shippori Mincho", serif;
		font-size: 60px;
		font-weight: 800;
		color: #B19652;
		right:auto;
		left: 50%;
		bottom:-38px;
		transform: translateX(-50%);
	}
	.grid2_inner:nth-child(2)::before{content:none;}
	.grid2_inner:nth-child(2)::after{
		left:auto;
		right: 0;
		transform: rotate(-180deg) scale(-1, 1);
	}

	.aspect_comment_box{padding-top:45px;}
	
	.profile-card{max-width:600px;justify-content:center;gap:20px;}
	.profile-text{display:contents;}
	.profile_namebox{order:1;width:100%;justify-content:center;padding-bottom:0;}
	.profile-link{order:2;margin:auto;}
	.profile_textbox{order:3;width:100%;}
	
}

@media only screen and (max-width:767px) {
	
	.about_dawn_listtitle::before, .about_dawn_listtitle::after{width:calc((100% - 280px)/ 2);}
	
	.about_dawn_list{gap:10px;}
	.about_dawn_list li {width: calc((100% - (10px * 3)) / 4);}
	.about_dawn_list li a > div:nth-child(1){font-size:12px;}
	
	.intro_wrap > img[src*="haku"]{top: -62px;}

	.aspect_note div:nth-child(2),.aspect_note div:nth-child(3){width:100%;}
	
	.btn_list_box{margin:auto;padding:8vw 0 5vw;max-width:300px;}
	.btn_list_box a{font-size:14px;padding:3px 30px 3px 20px;}

}

@media only screen and (max-width:580px) {
	
	.about_dawn_text::before{left:2.5%;}
	.about_dawn_text::after{right:2.5%;}
	.about_dawn_text{padding:6vw 0;font-size:20px;}
	
	.about_dawn_headprofbox{max-width:380px;}
	.about_dawn_list{gap:20px 10px;margin:auto;max-width:260px;}
	.about_dawn_list li{width:calc((100% - 10px)/ 2);}
	.about_dawn_list li a > div:nth-child(2) {width:80%;}
	
	#birthForm > div{padding:2.5vw 0;}
	#birthForm > div.form_title{margin:0 auto 2vw;width:90%;}

	input[type="text"]{display:block;width:80%;margin:auto;}

	#result{padding-top:12vw;}
	.result_top_img{padding-bottom:2vw;}

	.combokeyword_box h2{padding:0 10vw;font-size:10vw;}
	.combokeyword_box h2 > span{width:100%;}
	.combokeyword_box h2 .combo_sun_img,
	.combokeyword_box h2 .combo_moon_img {width:15vw;}
	.combokeyword_box h2 > span:nth-child(2){line-height:.9em;}
	.combokeyword_sun{justify-content:center;}
	.combokeyword_moon{justify-content:center;}

	.combokeyword_main{padding:7vw 0 8vw;}
	.combokeyword_main p{font-size:5vw;padding-bottom:0.2em;}
	.combokeyword_main h3{font-size:8.5vw;}

	.intro_wrap > img[src*="haku"]{right:-10px;}
	.intro_inner{padding:15px 8vw;}

	.result_main_box{padding:;}

	.icon_box{justify-content:flex-start;border-radius:20px;}
	.icon_area{padding:2vw 0 8vw;}
	.icon_imgbox{width:76px;margin:auto 0;}
	.icon_text{display:contents;}
	.icon_char{text-align:left;margin:auto 0;display:inline-block;}
	.icon_link {display: inline-block;margin-top: 5px;}
	.icon_intro{width:100%;padding-bottom:10px;}

	.combokeyword_lead h3{font-size:9vw;}

	.combokeyword_lead{padding-bottom:4vw;}
	.combokeyword_lead p{font-size:18px;}

	.grid2 {gap: 4vw;}
	.grid2_inner{padding:5vw 5.2vw;}
	.grid2_inner::before, .grid2_inner::after{width:30vw;}
	.grid2_inner:nth-child(1)::after{bottom: -46px;}
	.main_celes-icon{gap:2.5vw;}
	.main_sun_img, .main_moon_img {width:auto;display:block;}
	.main_sun_img img, .main_moon_img img {width:13vw;}
	.main_sun_img div, .main_moon_img div {font-size:2.8vw;}
	.main_sun_signname, .main_moon_signname {font-size: 12.5vw;}
	.main_face{margin-left:auto;}
	.sun_text, .moon_text{padding:4vw 0 2vw;font-size:15px;}

	.moon-phase{padding:1.5vw 0;}
	.moon-icon{width:60px;}

	.aspect_comment_box{padding:8vw 0 2vw;}
	.aspect_comment{padding:3vw 5vw;font-size:15px;}
	.aspect_comment_title{padding:2vw 7vw;font-size:7vw;}
	.aspect_note{padding:5vw 0 0;}
	.aspect_note div:nth-child(2){font-size:8.5vw;}

	.grid_note{}
	.grid_note ul{gap:0 20px;}
	.grid_note ul li{width:calc((100% - 20px)/ 2);}
	.grid_note ul li::after{content:none;}
	.grid_note ul li:nth-child(odd){text-align:right;}
	.grid_note ul li:nth-child(even){text-align:left;}
	.grid_note ul li:nth-child(5){text-align: center;}

	.result_button{padding:1vw 7vw 12vw;}
	.char-selecttitle::before,.char-selecttitle::after{width:calc((100% - 270px)/ 2);}
	.char-select{padding-top:12vw;}

	.profile-card{width:100%;gap:10px;}
	.profile_namebox{padding-bottom:1vw;}
	.profile-link{background-color:rgba(0,0,0,0);}
	.avatar{width:100%;}
	
	.screenshot-mode .grid2_inner:nth-child(1):before,
	.screenshot-mode .grid2_inner:nth-child(2)::after{
		content: none;
	}

}

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

	.sunmoon_form_box{padding:2.5vw 5vw 5vw;}
	.form_title img{width:24px;bottom:-6px;right:calc(-3vw - 20px);transform: rotate(22deg);}

	button[type="submit"] {font-size:18px;letter-spacing:0.06em;}

	.intro_box{padding: 20px 5vw 60px;}

	.intro_h2box p{padding-top:8px;padding-right:8vw;}
	.intro_wrap > img[src*="haku"]{width:29vw;top:-62px;right:-2.5vw;border-radius:25%;}
	.intro_h2box {padding-bottom: 35px;}

	.intro_inner h3{padding-bottom:20px;}

	.result_top_img{padding-bottom:3vw;}

	.combokeyword_box h2 {font-size:13vw;}
	.combokeyword_box h2 .combo_sun_img{width:18vw;}
	.combokeyword_box h2 .combo_moon_img {width:17vw;}
	.combokeyword_sun span:nth-child(2), .combokeyword_moon span:nth-child(2){padding-bottom:1vw;}

	.combokeyword_main h3 {font-size:9.5vw;}

	.result_main_box{padding: 20px 5vw 30px;}

}