@media screen and (max-width: 1020px) {
	#logo img {
		max-width: 80%;
	}

	.main_inner {
		padding: 0 90px 55px 90px;
	}

	.about_description h2 {
		font-size: 2.3rem;
	}

	.main_container {
		max-width: 100%;
	}

	.main_container:after {
		content: "";
		background-size: contain;
		background-repeat: no-repeat;
		background-position: top center;
		background-image: url("../images/wave_1050.svg");
		z-index: 1;
	}

	.about {
		padding: 0 60px;
	}

	p.copy {
		font-size: 1.5rem;
	}

	.story {
		max-width: 740px;
	}

	.story_title {
		margin-bottom: 5px !important;
	}

	.story_title img {
		max-width: 400px;
	}

	.midashi {
		font-size: 2.7rem;
		line-height: 1.4;
	}

	.suger_title img {
		max-width: 378px;
	}

	.suger_title {
		margin-bottom: -20px;
	}

	.suger_img {
		padding-left: 50px;
	}

	.suger_title2 {
		margin-bottom: -25px;
	}

	.suger_title2 img {
		max-width: 340px;
	}

	.suger_title3 img {
		max-width: 365px;
	}

	.suger_description3 .title_label {
		margin-top: -25px;
	}

	.suger_load_img2 img {
		max-width: 270px;
	}

	.suger_loadmap {
		padding: 0 50px;
	}

	.suger_loadmap:before {
		content: url("../images/bg_icon2.png");
		top: -10px;
	}

	.suger_loadmap_title img {
		max-width: 345px;
	}

	.suger_loadmap_title_box {
		padding-left: 12px;
	}

}




@media screen and (min-width: 760px) and (max-width: 1020px) {

	.main_container {
		padding: 85px 90px 0 90px;
	}

	.main_inner {
		padding: 0 0 55px 0;
	}

	.about {
		margin-bottom: 45px;
	}

}



@media screen and (max-width: 760px) {
	.sp {
		display: block;
	}

	.pc {
		display: none !important;
	}

	#logo {
		display: none;
	}

	.sp_header {
		position: absolute;
		top: 0;
		right: 0;
		width: auto;
	}

	.sp_header_inner {
		display: flex;
		width: auto;
		text-align: right;
		padding: 3px 10px;
	}

	/* .sp_instagram img {
		width: 60% !important;
	} */

	.sp_header_inner button {
		display: inline-block;
		position: static;
		margin-right: 12px;
		vertical-align: top;
		padding: 10px 0;
		margin-top: -10px;
	}

	.sp_header button {
		position: static;
		margin-top: -6px;
		margin-right: 15px;
	}

	.drawer-open button {
		margin-top: 0;
	}

	.drawer-hamburger {
		width: 3.8rem !important;
	}

	.sp_instagram {
		display: inline-block;
		padding: 5px 0;
	}

	.sp_instagram img {
		height: 35px;
	}

	#global_menu nav {
		width: 100%;
	}

	#global_menu nav ul {
		width: 100%;
		flex-wrap: wrap;
	}

	#global_menu nav ul li {
		width: 100% !important;
		text-align: left;
	}

	#global_menu nav ul li a {
		display: block;
		padding: 15px;
	}

	#global_menu nav ul li img {
		display: block;
		width: auto;
		height: 60px;
		margin: 0;
	}

	#menu00 {
		background: radial-gradient(#eb94ad 10%, #ee9ab2 90%);
	}

	#menu01 {
		background: radial-gradient(#f2ba7d 10%, #f0ae7a 90%);
	}

	#menu02 {
		background: radial-gradient(#9cd5d6 10%, #70bfc1 90%);
	}

	#menu03 {
		background: radial-gradient(#bfdb9e 10%, #90ba6a 90%);
	}

	#menu04 {
		background: radial-gradient(#a897c7 10%, #8069ac 90%);
	}

	#menu00 a {
		display: block;
		padding: 27px 15px !important;
	}

	#menu00 img {
		height: 27px !important;
	}

	#menu04 a {
		display: block;
		padding: 27px 15px !important;
	}

	#menu04 img {
		height: 30px !important;
	}

	.hojo {
		margin-top: 10px;
	}

	ul.pc_menu {
		display: none !important;
	}

	#logo {
		display: none;
	}

	.popup {
		display: block;
		padding: 0;
		border: none;
		position: static;
		width: 100%;
	}

	#global_menu nav ul {
		display: flex;
		list-style-type: none;
	}

	#wrap .popup dl {
		margin-bottom: 15px;
	}

	#wrap .popup dl dd ul li {
		width: 48% !important;
		margin-right: 2%;
		padding: 0;
	}

	.popup dl dd ul li:last-child {
		margin-right: 0;
	}

	#wrap .popup dl dd ul#color_change_area li {
		width: 31% !important;
	}

	/******************************
		main
		*****************************/

	#main {
		width: 100%;
		height: 100%;
		background-image: linear-gradient(90deg,
				#ddd9ec 25%, #fff 25%, #fff 50%, #ddd9ec 50%, #ddd9ec 75%, #fff 75%, #fff);
		background-size: 90px 90px;

	}

	.main_container {
		margin-bottom: 40px;
		padding-top: 25px;
	}

	.main_container:after {
		content: "";
		background-image: url("../images/wave_sp.svg");
		background-size: cover;
	}

	.main_inner {
		padding: 0 0 55px 0;
	}

	p.copy {
		font-size: 1.35rem;
	}

	.midashi {
		font-size: 2.2rem;
	}

	.about {
		padding: 0 30px;
		flex-wrap: wrap;
		margin-bottom: 30px;
	}

	.about_description {
		width: 100%;
		margin-right: 0;
		margin-bottom: 30px;
	}

	.about_description h2 {
		font-size: 2rem;
	}

	.about_img {
		width: 100%;
	}

	.story {
		padding: 0 30px;
	}

	.story_title img {
		max-width: 100%;
	}

	.title_label span {
		font-size: 1.8rem;
	}

	.suger {
		padding: 0 30px;
	}

	.suger_title {
		margin-bottom: 0;
	}

	.suger_sp_colum {
		display: flex;
	}

	.suger_sp_col {
		width: 30%;
		margin-right: 3%;
	}

	.suger_sp_col:last-child {
		width: 67%;
		margin-right: 0;
	}

	.suger_title {
		margin-left: 0;
	}

	.suger_title img {
		max-width: 100%;
	}

	.suger2 {
		padding: 0 30px;
	}

	.suger_title2 {
		margin: 0;
		padding: 0 30px;
	}

	.suger_title2 img {
		max-width: 100%;
	}

	.suger_sp_col2 {
		width: 62%;
		margin-right: 3%;
	}

	.suger_sp_col2:last-child {
		width: 35%;
		margin-right: 0;
	}

	.suger3 {
		margin-bottom: 30px;
		padding: 0 30px;
	}

	.suger_sp_col3 {
		width: 30%;
		margin-right: 3%;
	}

	.suger_sp_col3:last-child {
		width: 67%;
		margin-right: 0;
	}

	.title_label_right {
		text-align: right;
		padding: 0 30px;
	}

	.suger_title3 {
		margin-top: 0;
	}

	.suger_title3 img {
		max-width: 95%;
	}

	.suger_loadmap_title_box {
		margin-bottom: 10px;
		padding-left: 10px;
	}

	.suger_loadmap_title {
		display: block;
		line-height: 1;
	}

	.suger_loadmap {
		padding: 0;
	}

	.suger_loadmap:before {
		content: "";
		display: none;
	}

	.area_description {
		padding: 12px;
	}

	.area_description ul li {
		font-size: 1.2rem;
	}

	.area_description ul li span {
		font-size: 1.2rem;
		margin-right: 10px;
	}

	.suger_load_title2 {
		width: 95%;
	}

	.suger_load_img2 {
		position: static;
		display: block;
		text-align: right;
	}

	.suger_load_inner {
		max-width: 100%;
		width: 100%;
		margin: 60px auto 0 auto;
		padding: 0 10px;
	}

	#detail_btn {
		display: block;
		margin: 0 auto;
		padding: 0 30px 40px 30px;
		max-width: 100%;
	}

	.area_col {
		height: 132px;
	}

	.footer_container {
		max-width: 100%;
	}

	#footer p.footer_title {
		font-size: 1.7rem;
	}

	#footer {
		padding: 60px 20px;
	}

	#footer p {
		font-size: 0.95rem;
	}

}


@media screen and (min-width: 760px) {
	.sp {
		display: none !important;
	}

	.pc {
		display: block;
	}

	#mainvisual nav {
		display: none;
	}

	#mainvisual button {
		display: none;
	}

	.sp_header {
		display: none;
	}


}