/* Scss Document */
/*
$img1:url("https://musicpowerforall.com/wordpress/wp-content/themes/musicpowerforall/images/common/bk_img1.png");
$img2:url("https://musicpowerforall.com/wordpress/wp-content/themes/musicpowerforall/images/common/bk_img2.png");
$img3:url("https://musicpowerforall.com/wordpress/wp-content/themes/musicpowerforall/images/service/eyecatch.jpg");
$img4:url("https://musicpowerforall.com/wordpress/wp-content/themes/musicpowerforall/images/gakki/gakki01.png");
$img5:url("https://musicpowerforall.com/wordpress/wp-content/themes/musicpowerforall/images/gakki/gakki03.png");
*/
body.loaded:before { background-image: url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:eco/v1588298723/images/service/eyecatch_wyyh57.jpg"); }

#wrapper > header#header { background-image: url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:low/v1588298377/images/common/bk_img2_teftur.png"), url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:eco/v1588298723/images/service/eyecatch_wyyh57.jpg"); background-position: left bottom,center top 30%; }
#wrapper > header#header #lnavi.close { left: -230px; transition: left 0.5s; }
#wrapper > header#header nav#lnavi { position: fixed; left: -32px; bottom: -220px; z-index: 8888; width: 230px; transition: left 0.5s; }
#wrapper > header#header nav#lnavi > div { padding-top: 197.5%; background-size: 100%; height: 0; background-image: url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:eco/v1588298414/images/gakki/gakki01_xx23sw.png"); position: relative; }
#wrapper > header#header nav#lnavi > div h3 { position: absolute; top: 14%; left: -49px; text-shadow: 0 0 8px #000, 0 0 8px #000; width: 100%; font-weight: 500; font-family: roboto, sans-serif; font-style: italic; color: #fff; text-align: center; font-size: 2.3rem; /*					width:100%;
					text-align:center;
					font-size:2.6rem;
					font-weight:700;
					letter-spacing: 2px;
					a{
						color:#fff;
					}*/ }
#wrapper > header#header nav#lnavi > div ul { position: absolute; top: 23%; left: 21%; }
#wrapper > header#header nav#lnavi > div ul li { color: #fff; line-height: 1.1; text-shadow: 0 0 8px #000, 0 0 8px #000; }
#wrapper > header#header nav#lnavi > div ul li a { color: #fff; font-weight: 600; border-bottom: 2px dotted #fff; display: block; margin-right: 40px; margin-bottom: 8px; font-size: 1.5rem; }
#wrapper section { padding: 15vw 10% 7vw; }
#wrapper section h2 { margin-bottom: 4vw; line-height: 1.3; }
#wrapper section p { margin-bottom: 2vw; }
#wrapper section figcaption { font-size: 1.6rem; margin-bottom: 1vw; }
#wrapper .sect1 { padding-bottom: 60px; }
#wrapper .sect1 > div ul li { display: flex; flex-wrap: wrap; background-color: #fdeb92; border: 1px solid #2f0000; padding: 3% 0 2%; }
#wrapper .sect1 > div ul li > span { display: block; font-size: 4vw; line-height: 1; }
#wrapper .sect1 > div ul li > span em { font-size: 12vw; margin-left: 1vw; line-height: 1.2; }
#wrapper .sect1 > div ul li > span:nth-child(1) { width: 29%; font-family: mr-eaves-modern, sans-serif; font-weight: 400; font-style: italic; box-sizing: border-box; padding-left: 3vw; }
#wrapper .sect1 > div ul li > span:nth-child(2) { width: 69%; line-height: 2.8; font-size: 5.2vw; }
#wrapper .sect1 > div ul li + li { margin-top: 20px; }
#wrapper .sect2 { padding: 8vw 6%; background-color: rgba(47, 0, 0, 0.4); background-image: url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:low/v1588298376/images/common/bk_img1_ygzapb.png"), url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:low/v1588298377/images/common/bk_img2_teftur.png"); background-repeat: no-repeat; background-position: top left,bottom right; background-size: 60%,60%; }
#wrapper .sect2 > div { position: relative; /*	overflow: hidden;*/ }
#wrapper .sect2 > div div.left_col { display: inline-block; width: 100%; vertical-align: top; }
#wrapper .sect2 > div div.left_col header h2 { font-size: 7.5vw; color: #fff; }
#wrapper .sect2 > div div.left_col p { color: #fff; margin-bottom: -3vw; }
#wrapper .sect2 > div div.right_col { position: absolute; top: -60px; right: -6%; display: inline-block; width: 45%; vertical-align: top; }
#wrapper .sect2 > div div.right_col > div { padding-top: 92%; border: 5px solid #ccc; height: 0; background-color: #fff; border-radius: 50%; position: relative; }
#wrapper .sect2 > div div.right_col > div p { position: absolute; width: 100%; height: 100%; top: 15%; left: 0; text-align: center; font-size: 3vw; line-height: 1.1; font-weight: 500; }
#wrapper .sect2 > div div.right_col > div p > span { font-size: 4.5vw; line-height: 0.8; }
#wrapper .sect2 > div div.right_col > div p > span > span { font-family: mr-eaves-modern, sans-serif; font-weight: 600; font-style: italic; font-size: 13vw; }
#wrapper .sect2 > div ul.service_type { margin-top: 20px; }
#wrapper .sect2 > div ul.service_type li { background-color: #fff; border: 1px solid #2f0000; box-sizing: border-box; padding: 9% 10% 4%; }
#wrapper .sect2 > div ul.service_type li p.name { text-align: center; font-weight: bold; font-size: 5.5vw; line-height: 1.3; margin-bottom: 0; }
#wrapper .sect2 > div ul.service_type li p.name span { display: block; font-weight: 400; font-size: 5vw; }
#wrapper .sect2 > div ul.service_type li p.price { text-align: center; margin-top: 10px; margin-bottom: 10px; }
#wrapper .sect2 > div ul.service_type li p.price span { font-family: mr-eaves-modern, sans-serif; font-weight: 400; font-style: italic; font-size: 10vw; line-height: 0.9; }
#wrapper .sect2 > div ul.service_type li p.time { text-align: center; margin-top: 10px; margin-bottom: 10px; }
#wrapper .sect2 > div ul.service_type li p.time span { font-family: mr-eaves-modern, sans-serif; font-weight: 400; font-style: italic; font-size: 10vw; line-height: 0.9; }
#wrapper .sect2 > div ul.service_type li + li { margin-top: 20px; }
#wrapper .sect2 > div > div { margin-top: 20px; margin-bottom: 20px; }
#wrapper .sect2 > div > div p.title { color: #fff; font-size: 7vw; font-weight: bold; padding-bottom: 10px; line-height: 1.3; }
#wrapper .sect2 > div > div p.title span { display: block; margin-left: 7vw; }
#wrapper .sect2 > div div.kaisu p, #wrapper .sect2 > div div.ninzu p { color: #fff; }
#wrapper .sect2 > div div.contents ul li { width: 48%; background-color: #fff; margin-left: 0; margin-right: 1%; margin-top: 5px; border-radius: 30px; padding: 4% 2.5% 0; box-sizing: border-box; height: 29vw; border: 5px solid #fff; }
#wrapper .sect2 > div div.contents ul li p { text-align: center; line-height: 1.3; font-size: 3.8vw; margin-bottom: 0; }
#wrapper .sect2 > div div.contents ul li p:nth-child(1) { margin-bottom: 1.8vw; line-height: 2; font-size: 4.8vw; font-weight: bold; color: #6e4d3d; }
#wrapper .sect2 > div div.contents ul li:nth-child(2n) { margin-right: 0; }
#wrapper .sect3 { padding-top: 60px; padding-bottom: 60px; }
#wrapper .sect3 > div header h2 { font-size: 8vw; text-align: center; }
#wrapper .sect3 > div dl { /*display:flex;
flex-wrap:wrap;*/ margin-bottom: 3vw; }
#wrapper .sect3 > div dl dt { /*width:25%;*/ font-size: 4vw; line-height: 1.3; margin-right: 2%; border: 1px solid #000; box-sizing: border-box; padding: 2%; text-align: center; margin-bottom: 3vw; }
#wrapper .sect3 > div ul { /*display:flex;
flex-wrap: wrap;*/ margin-bottom: 20px; /*				li+li{
					margin-left:2%;
				}*/ }
#wrapper .sect3 > div ul li { width: 100%; border: 1px solid #000; box-sizing: border-box; padding: 2% 0 2.5%; margin-bottom: 20px; }
#wrapper .sect3 > div ul li p { text-align: center; font-size: 1.8rem; margin-bottom: 1vw; }
#wrapper .sect3 > div ul li p span { font-family: mr-eaves-modern, sans-serif; font-weight: 400; font-style: italic; font-size: 10vw; line-height: 1.2; }
#wrapper .sect3 > div ul li p:nth-child(1) { font-size: 2.8rem; line-height: 1; padding: 20px; }
#wrapper .sect4 { background-color: rgba(250, 214, 38, 0.5); padding-top: 60px; padding-bottom: 0; background-image: url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:low/v1588298376/images/common/bk_img1_ygzapb.png"), url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:low/v1588298377/images/common/bk_img2_teftur.png"); background-repeat: no-repeat; background-position: top left,bottom -3px right 45%; background-size: 100%,100%; }
#wrapper .sect4 > div header { margin-bottom: 20px; }
#wrapper .sect4 > div header h2 { text-align: center; }
#wrapper .sect4 > div > p { text-align: center; margin-top: 20px; margin-bottom: 20px; }
#wrapper .sect4 > div [class^=part] { background-color: #fff; margin-bottom: 3vw; padding: 10% 10% 8%; box-sizing: border-box; }
#wrapper .sect4 > div [class^=part] dt { font-size: 6vw; line-height: 1; font-weight: 600; margin-bottom: 3vw; }
#wrapper .sect4 > div [class^=part] dt dd { line-height: 1.3; }
#wrapper .sect4 > div .parts4 { padding: 2%; }
#wrapper .sect4 > div .more { margin-top: 20px; width: 80%; margin-left: 5%; margin-right: 5%; display: flex; flex-wrap: wrap; }
#wrapper .sect4 > div .more .circle { width: 60%; }
#wrapper .sect4 > div .more .circle span { display: block; width: 100%; margin-top: 20px; padding-top: 25%; padding-bottom: 75%; height: 0; background-color: #fff; border-radius: 50%; box-sizing: border-box; text-align: center; font-size: 4vw; font-weight: bold; line-height: 1.3; }
#wrapper .sect4 > div .more .btn_more { width: 50%; margin-top: -11vw; margin-bottom: 0; }
#wrapper .sect4 > div .more .btn_more a { display: block; padding-top: 35.3%; padding-bottom: 135.3%; height: 0; background-image: url("https://res.cloudinary.com/drvwspeq4/image/upload/f_auto,q_auto:eco/v1588298413/images/gakki/gakki03_z5hiyx.png"); background-size: 100%; text-align: center; font-size: 6vw; line-height: 1.1; color: #fff; font-weight: 700; text-shadow: 0 0 8px #000, 0 0 8px #000; }
#wrapper .sect5 { padding: 60px 6%; }
#wrapper .sect5 > div header h2 { text-align: center; }
#wrapper .sect5 > div > p { margin-top: 20px; margin-bottom: 20px; }
#wrapper .sect5 > div ul { /*	display:flex;
	flex-wrap:wrap;*/ /*				li+li{
					margin-left:2%;
					
				}*/ }
#wrapper .sect5 > div ul li { width: 100%; border: 1px solid #2f0000; box-sizing: border-box; padding: 5vw 0; line-height: 1.5; margin-bottom: 3vw; }
#wrapper .sect5 > div ul li > a div { text-align: center; }
#wrapper .sect5 > div ul li > a div p:nth-child(2) { display: inline-block; border-bottom: 2px dotted #2f0000; }
#wrapper .sect5 > div ul li p { text-align: center; font-size: 3.8vw; padding-top: 30px; font-weight: bold; }
#wrapper .sect5 > div ul li p:nth-child(1) { font-size: 5.5vw; }
#wrapper .sect5 > div ul li:nth-child(2) { background-color: #eee; }