@charset "utf-8";
.chaos_maker_container{padding:30px 0 100px;border-top:2px solid #fff;}
	.chaos_group_tit{width:fit-content;margin:-80px auto 0;position:relative;box-sizing:border-box;height:auto;overflow:hidden;padding:2em 2em 1em;min-width:50%;text-align:center;}
	.chaos_group_tit::before{content:"";display:block;width:100%;height:150%;border-radius:100%;position:absolute;z-index:1;top:-2px;left:0;background:#fff;}
	.chaos_group_tit::after{content:"";display:block;width:100%;height:150%;border-radius:100%;position:absolute;z-index:2;top:0;left:0;}
	.chaos_group_tit h2{position:relative;z-index:3;}
	
	#chaosmap_container{margin:0 0 50px;padding:30px 0 100px;background:linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%), linear-gradient(to right, #50b8ffc4, rgb(0 255 245 / 30%));}
	#chaosmaps{width:100%;min-height:40vh;position:relative;box-sizing:border-box;background:transparent;padding-bottom:30px;}
	.chaosmap_group{display:none;width:100%;left:0;box-sizing:border-box;padding:0 5vw;position:relative;z-index:5;}
	.chaosmap_group.active{display:grid;}
	
	.chaosmap_ruler{display:block;position:absolute;width:100%;height:100%;z-index:2;top:0;left:0;}
	.chaosmap_ruler p{display:block;position:absolute;z-index:2;height:fit-content;box-sizing:border-box;padding:10px;border-radius:1em;}
	.chaosmap_ruler_top{width:fit-content;top:0;left:0;right:0;margin:0 auto;background:#fffcd4;line-height:1;}
	.chaosmap_ruler_bottom{width:fit-content;bottom:0;left:0;right:0;margin:0 auto;background:#c8cfff;line-height:1;}
	.chaosmap_ruler_left{width:calc(1em + 20px);left:0;top:0;bottom:0;margin:auto 0;background:#ffdde2;}
	.chaosmap_ruler_right{width:calc(1em + 20px);right:0;top:0;bottom:0;margin:auto 0;background:#90ee90;}
	
	#chaosmap_first{width:fit-content;margin:0 auto;grid-template-columns:1fr auto 1fr;grid-template-rows:repeat(3, auto);align-items:center;padding-top:40px;padding-bottom:40px;}
	#chaosmap_first::before{content:"";display:block;background:#ffffff55;width:76%;height:96%;position:absolute;top:2%;left:12%;z-index:1;border-radius:100%;}
	.chaosmap_controll,.chaosmap_fir_cap{cursor:pointer;position:relative;z-index:4;text-align:center;animation: poyopoyo 3s ease-out;opacity: 1;}
	.chaosmap_controll:hover img{animation: poyopoyo 3s ease-out;}
	@keyframes poyopoyo {0%, 40%, 60%, 80% {transform: scale(1.0);}50%, 70% {transform: scale(0.95);}}
	#chaosmap_cont1_1{width:100%;grid-row:1;grid-column:1 / 4;animation-delay: 0s;}
	#chaosmap_cont1_2{width:fit-content;grid-row:2;grid-column:3;animation-delay: 0.5s;}
	#chaosmap_cont1_3{width:fit-content;grid-row:2;grid-column:1;animation-delay: 1s;}
	.chaosmap_fir_cap{width:fit-content;grid-row:2;grid-column:2;box-sizing:border-box;padding:1em;animation-delay: 1.5s;}
	#chaosmap_cont1_4{width:100%;grid-row:3;grid-column:1 / 4;animation-delay: 2s;}
	.chaosmap_fir_cap p{display:block;width:fit-content;margin:0 auto;background:#0088e8;color:#fff;font-weight:bold;border-radius:100%;box-sizing:border-box;padding:1em;}
	.chaosmap_con_tit{width:fit-content;text-align:center;font-size:120%;box-sizing:border-box;padding:1.5em;border-radius:50%;background:#fff;margin:1em auto 2em;font-weight:bold;}
	
	.chaosmap_list{display:flex; flex-flow:row wrap;gap:2em 10px;justify-content:center;}
	.chaosmap_list li{display:block;width:fit-content;border-radius:1em;background:#fff;text-align:center;animation: slideIn2 1s cubic-bezier(0.25, 1, 0.5, 1) forwards;}
	@keyframes slideIn2 {0% {transform: translateX(180px);opacity: 0;}100% {transform: translateX(0);}40%,100% {opacity: 1;}}
	.chaosmap_list li a{display:grid;grid-template-rows:auto 70px auto;grid-template-columns:1fr;justify-items:center;align-items:center;box-sizing:border-box;padding:0 1em 1em;}
	.chaosmap_list li a img{max-width:200px;max-height:70px;}
	.chaosmap_list li:has(.chaosmap_controller){background:transparent;}
	.chaosmap_list_catch{display:block;width:fit-content;box-sizing:border-box;max-width:100%;border-radius:0.5em;line-height:1.2;padding:0.5em 1em 0.3em;margin:-1em auto 1em;background:#47b3ff;position:relative;color:#fff;}
	.chaosmap_list_catch::after{content:"";display:block;position:absolute;z-index:2;width:15px;height:15px;bottom:-13px;left:0;right:0;margin:0 auto;clip-path:polygon(0 0,100% 0,50% 100%);background:#47b3ff;}
	.chaosmap_list_name{color:#666;}
	.chaosmap_list.magnific li{width:100%;}
	.chaosmap_list.magnific .chaosmap_list_catch{max-width:100%;}
	.chaosmap_list.magnific li a img{max-width:100%;max-height:100px;width:fit-content;height:auto;}
	.chaosmap_list.magnific li a{grid-template-rows:repeat(3, auto);}
	.chaosmap_list.magnific .chaosmap_list_name{max-width:100%;padding-top:0.5em 0 0;}
	
	.chaosmap_controller{display:flex;justify-content:center;flex-flow:column wrap;width:100%;height:100%;background:transparent;}
	.chaosmap_reset,.minimag{width:100%;box-sizing:border-box;padding:0.5em;color:#0088e8;background:transparent;cursor:pointer;animation: poyopoyo 3s ease-out 3s;}
	.chaosmap_reset{display:block;}
	.chaosmap_controller img{display:block;max-width:170px;height:auto;}
	.minimag{display:none;}
	
	#chaos_group01,
	#chaos_group01 .chaos_group_tit::after{background:#d9f6ff;}
	#chaos_group02,
	#chaos_group02 .chaos_group_tit::after{background:#dae7ff;}
	#chaos_group03,
	#chaos_group03 .chaos_group_tit::after{background:#afebe3;}
	#chaos_group04,
	#chaos_group04 .chaos_group_tit::after{background:#82f2ff;}
	
	.chaos_anchor{display:block;border:none;width:100%;height:1px;margin:0;}
	
	.chaos_maker_box{display:grid;grid-template-columns:60% 1fr;gap:10px;width:100%;background:#fff;border-radius:10px;margin-bottom:50px;box-sizing:border-box;padding:1em;}
	.chaos_maker_mainimg{grid-row:1 / 3;grid-column:2;}
	.chaos_maker_mainimg a{display:block;position:relative;box-sizing:border-box;border:1px solid #ccc;border-radius:8px;overflow:hidden;}
	.chaos_maker_mainimg img{display:block;position:relative;z-index:1;}
	.chaos_maker_mainimg span{display:block;position:absolute;z-index:2;bottom:0;left:0;width:100%;text-align:center;color:#fff;height:fit-content;box-sizing:border-box;line-height:1;padding:0.5em;font-weight:bold;text-shadow:0 0 3px #0088e8,0 0 3px #0088e8;}
	#chaos_group01 .chaos_maker_mainimg span{background:#1fabd7b3;}
	#chaos_group02 .chaos_maker_mainimg span{background:#74a9f7a6;}
	#chaos_group03 .chaos_maker_mainimg span{background:#32c3b0bf;}
	#chaos_group04 .chaos_maker_mainimg span{background:#14c6dbbf;}
	.chaos_maker_text{grid-row:2;grid-column:1;}
	.chaos_maker_title{grid-row:1;grid-column:1;display:flex;flex-flow:row wrap;align-items:center;justify-content:center;margin-bottom:10px;}
	.chaos_maker_title_logo{width:fit-content;max-width:35%;display:block;}
	.chaos_maker_title > h3{display:block;width:fit-content;box-sizing:border-box;padding:0 0.5em;font-size:150%;color:#001c6d;line-height:1.2;}
	.chaos_maker_links{display:flex;gap:10px;}
	.chaos_maker_links > a{display:block;width:fit-content;color:#fff;}
	.chaos_maker_links > a:visited{color:#fff;}
	.chaos_maker_links > a:hover{transform:translate(2px,2px);background:#ff6a00;}
	.chaos_maker_bottoms{grid-row:3;grid-column:1 / 3;}
	.chaos_maker_product_list{display:flex;flex-flow:row wrap;gap:20px;}
	.chaos_maker_product_list li{display:block;width:calc(50% - 10px);}
	.chaos_maker_product{display:flex;flex-flow:row wrap;gap:10px;align-items:center;box-sizing:border-box;padding:10px 15px;border:1px solid #ccc;border-radius:8px;background:#ebf8fb;height:100%;}
	.chaos_maker_proimg{width:30%;position:relative;background:#fff;border-radius:5px;}
	.chaos_maker_proimg img{display:block;border-radius:5px;position:relative;z-index:1;max-height:150px;width:fit-content;max-width:100%;margin:0 auto;}
	.chaos_maker_proimg::after{content:"ＰＲ";display:block;width:fit-content;box-sizing:border-box;padding:0 0.5em;background:#666666ad;color:#fff;border-radius:0 5px;position:absolute;bottom:0;left:0;z-index:2;font-size:1.2rem;}
	.chaos_maker_protxt{width:calc(70% - 10px);}
	.chaos_maker_protxt strong{display:block;border-bottom:1px dashed #0088e8;margin-bottom:0.5em;}
	.chaos_maker_product:hover{color:#ff6a00;}
	.chaos_maker_column_list li{margin-bottom:20px;}
	.chaos_maker_column_list a{display:grid;grid-template-columns:100px 1fr;gap:0 10px;align-items:center;box-sizing:border-box;overflow:hidden;padding:0 1em 0 0;border:1px solid #0088e8;color:#666;border-radius:10px;}
	.chaos_maker_column_list a:visited{color:#666;}
	.chaos_maker_column_list a:hover{background:#ebf8fb;}
	.chaos_maker_colimg{height:100%;overflow:hidden;}
	.chaos_maker_colimg img{display:block;width:100%;height:100%;object-fit:cover;}
	.chaos_maker_column_list span{display:block;width:fit-content;margin-left:auto;color:#0088e8;}
	
	#chaos_group00 h2 img{display:block;margin:0 auto;}
	#chaos_group00 .wrap2 > .text{margin:30px auto;width:fit-content;max-width:100%;}
	#chaos_cate_caplist{display:flex;flex-flow:row wrap;gap:15px 10px;}
	#chaos_cate_caplist > li{width:calc((100% - 45px) / 4);box-sizing:border-box;border-radius:10px;padding:1em 1em 0;border:2px solid #0088e8;box-shadow:2px 2px #4dcef4;display:grid;grid-template-columns:1fr;}
	#chaos_cate_caplist .title04{grid-row:1;}
	.chaos_cate_caplist_text{box-sizing:border-box;border-top:2px dashed #0088e8;border-bottom:2px dashed #0088e8;padding:0.5em;margin:0.5em 0;}
	.chaos_cate_caplist_makers{display:flex;flex-flow:row wrap;gap:0 15px;justify-content:center;}
	.chaos_cate_caplist_makers > p{width:100%;text-align:center;padding-top:5px;}
	.chaos_cate_caplist_makers > a{display:block;width:fit-content;box-sizing:border-box;padding:0 0.3em;border-radius:5px;background:#4dcef4;color:#fff;margin-bottom:10px;}
	.chaos_cate_caplist_makers > a:visited{color:#fff;}
	.chaos_cate_caplist_makers > a:hover{background:#0088e8;}
	.chaos_cate_caplist_links{text-align:center;padding:10px 0;}

	@media screen and (max-width:768px){
		#chaos_cate_caplist > li{width:calc((100% - 15px) / 2);}
		.minimag{display:block;}
		.chaosmap_list li:has(.chaosmap_controller){overflow:hidden;flex:1 0 auto;}
		.chaosmap_controller img{width:fit-content;max-width:100%;margin:0 auto;}
	}
	@media screen and (max-width:640px){
	.chaos_group_tit span{display:block;}
		#chaosmap_container{margin:0;}
		#chaosmaps{padding:20px 0 45px;}
		#chaosmap_first{grid-template-rows:auto 25vw auto;justify-items:center;padding:30px 2em;width:96%;}
		#chaosmap_first::before{width:calc(100% - 2em);left:1em;border-radius:10px;}
		#chaosmap_first::after{content:"気になる\Aジャンルを\Aクリック\Aしてね";display:block;width:5em;color:#0088e8;position:absolute;z-index:2;top:1.5em;left:1.5em;white-space: pre;animation: poyopoyo 3s ease-out;font-weight:bold;}
		#chaosmap_cont1_1,#chaosmap_cont1_2,#chaosmap_cont1_3,#chaosmap_cont1_4{max-width:35vw;}
		.chaosmap_fir_cap{display:none;}
		.chaosmap_ruler p.chaosmap_ruler_right,
		.chaosmap_ruler p.chaosmap_ruler_left{width:calc(1em + 10px);padding:10px 5px;}
		.chaosmap_ruler p.chaosmap_ruler_top,
		.chaosmap_ruler p.chaosmap_ruler_bottom{padding:5px 10px;}
		.chaosmap_list{gap:2em 10px;}
		.chaosmap_list li a{grid-template-rows:repeat(3, auto);height:100%;padding:0 0.5em 1em;}
		.chaosmap_list li a img{max-width:calc(45vw - calc(1em + 10px));}
		.chaosmap_list_catch{padding:0.5em 0.5em 0.3em;max-width:calc(45vw - 2em);}
		.chaosmap_list_name{max-width:calc(45vw - 1em);}
		.chaosmap_con_tit span{display:none;}
		.chaosmap_con_tit strong{display:inline-block;}
		
		.chaos_cate_table,
		.chaos_cate_table tbody,
		.chaos_cate_table tr,
		.chaos_cate_table th,
		.chaos_cate_table td{display:block;}
		.chaos_cate_table thead{display:none;}
		.chaos_cate_table th{width:100%;background:#cfcfcf;text-align:center;border-bottom:0;}
		.chaos_cate_table th br{display:none;}
		.chaos_cate_table th span.f_blue{margin-left:0.5em;}
		.chaos_cate_table td{width:100%;}
		.chaos_cate_table ul.list_mark{display:flex;flex-flow:row wrap;gap:0 1.5em;}
		
		.chaos_maker_box{grid-template-columns:1fr;}
		.chaos_maker_title{margin:10px 0 0;}
		.chaos_maker_mainimg{grid-row:2;grid-column:1;}
		.chaos_maker_text{grid-row:3;}
		.chaos_maker_bottoms{grid-row:4;grid-column:1;}
		.chaos_maker_product_list li{width:100%;}
		.chaos_maker_product{padding:10px;}
		.chaos_maker_coltxt{padding-top:10px;}
		#chaos_cate_caplist > li{width:100%;}
	}