@charset "utf-8";

/** ▼▼▼▼▼▼▼▼▼▼ farstview ▼▼▼▼▼▼▼▼▼▼ **/
#farstview {display: flex;width: 100%;margin: 0;background: url("../manmaru_images/mv.png") no-repeat center center / cover;}
#farstview ul.farstview_iner {display: flex;align-items: center;justify-content: center;width: auto;height: 100vh;margin: 0 auto;padding: 0;list-style: none;}
#farstview ul.farstview_iner li h2 {width: 328px;height: auto;position: absolute;top: 50px;left: 50%;translate: -50% 0;}
/** ▲▲▲▲▲▲▲▲▲▲ farstview ▲▲▲▲▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼▼▼▼▼ about ▼▼▼▼▼▼▼▼▼▼ **/
#about {background-color: #000;position: relative;}
#about:before {content: '';width: 177px;height: 1076px;background-image: url("../manmaru_images/bk_left.png");background-repeat:  no-repeat;position: absolute;top:20%;left: 0;}
#about:after {content: '';width: 177px;height: 1076px;background-image: url("../manmaru_images/bk_right.png");background-repeat:  no-repeat;position: absolute;bottom:0%;right: 0;}
#about .inner {width: 1280px;margin: 0 auto 190px;position: relative;}
#about .inner .col2 {width: 100%;display: flex;justify-content: space-between;}
#about .inner .col2 .img_02 {width: 560px;box-sizing: border-box;padding: 80px 0 0;}
#about .inner .col2 .img_01 {width: 560px;box-sizing: border-box;}
#about .inner .col2 .img_01 img {width: 100%;height: auto;margin-top: -110px;}
#about .inner .about_box {width: 900px;height: 360px; margin-left: calc(50% - 400px);margin-top: -310px;background-image: url("../manmaru_images/about_box_bk.png");background-repeat: no-repeat;box-sizing: border-box;padding-left: 400px;}
#about .inner .about_box .about_box_in {width: 100%;height: 100%;position: relative;box-sizing: border-box;padding: 56px 0;}
#about .inner .about_box .about_box_in .tit.about {width: 40px;position: absolute;right: 0;top:-20px;}
#about .inner .about_box .about_box_in .about_box_tit {width: 322px;margin: 0 0 1em;}
#about .inner .img_03 {width: 360px;height: auto;position: absolute;left: 235px;bottom:-120px;}
#about .bnr_area {width: 1118px;margin: 0 auto 0;position: relative;}
#about .bnr_area .img_04 {width: 100%;height: auto;padding-bottom: 64px;}
#about .bnr_area .img_05 {width: 356px;height: auto;position: absolute;right: -120px;top:-120px;}
/** ▲▲▲▲▲▲▲▲▲▲ about ▲▲▲▲▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼▼▼▼▼ menu ▼▼▼▼▼▼▼▼▼▼ **/
#menu {background-color: #000;position: relative;box-sizing: border-box;padding: 0 0 96px;}
#menu .menu_inner {width: 1000px;margin: 0 auto 0;}
#menu .menu_inner .head {display: block;position: relative;margin: 0 auto 48px;}
#menu .menu_inner .head .tit.cuisine {width: 40px;position: absolute;left: 0;top:-20px;}
#menu .menu_inner .head .cuisine_box_tit {width: 737px;margin: 0 auto 16px;}
#menu .menu_inner .head p {font-size: 24px;font-weight: 500;text-align: center;color: #FFF;}
#menu .menu_inner .col2 {width: 100%;display: flex;justify-content: space-between;margin-bottom: 80px;}
#menu .menu_inner .col2 .col {width: 470px;}
#menu .menu_inner .col2 .col .ph {width: 100%;margin: 0 auto 16px;}
#menu .menu_inner .col2 .col .tit {font-size: 24px;font-weight: 700;margin-bottom: 16px;color: #FFF;}
#menu .menu_inner .col2 .col p {font-size: 16px;font-weight: 700;color: #FFF;}
#menu .menu_inner .cuisine_img03 {width: 810px;margin: 0 auto 0;}
/** ▲▲▲▲▲▲▲▲▲▲ menu ▲▲▲▲▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼▼▼▼▼ instore ▼▼▼▼▼▼▼▼▼▼ **/
#instore {position: relative;padding: 96px 0 120px 0;background-image: url("../manmaru_images/store_box_bk.png");background-size: cover;}
#instore .instore_inner {width: 100%;}
#instore .instore_inner .tit_instore {width: 40px;position: absolute;right:calc(50% - 500px);top:0;}
#instore .instore_inner .logo {width: 234px;margin: 0 auto 64px;}
#instore .instore_inner .store_box_tit {width: 757px;margin: 0 auto 40px;}
#instore .instore_inner p {font-size: 24px;font-weight: 500;margin-bottom: 64px;text-align: center;}
#instore .instore_inner .col2 {width: 1000px;margin: 0 auto 0;display: flex;justify-content: space-between;}
#instore .instore_inner .col2 .col {width: 489px;}
/** ▲▲▲▲▲▲▲▲▲▲ instore ▲▲▲▲▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼▼▼▼▼ staff ▼▼▼▼▼▼▼▼▼▼ **/
#two_in_one {padding: 0 0 88px 0;background: #000;}
#two_in_one div#staff {position: relative;width: 1000px;margin: 0 auto;padding: 96px 0 0;}
#two_in_one div#staff h2 {position: absolute;top: 0;left: 0;width: 40px;height: auto;}
#two_in_one div#staff h2 img {width: 100%;}
#two_in_one div#staff h3 {width: 611px;margin: 0 auto 40px;}
#two_in_one div#staff h4 {font-size: 24px;font-weight: 500;margin-bottom: 24px;text-align: center;color: #FFF;}
#two_in_one div#staff p {font-size: 14px;font-weight: 500;margin-bottom: 64px;text-align: center;color: #FFF;}

#two_in_one div#staff .staff_box {width: 900px;margin: 0 auto 64px;}
#two_in_one div#staff .staff_box .col {width: 100%;display: flex;justify-content: space-between;align-items: flex-start;}
#two_in_one div#staff .staff_box .col:first-child {margin-bottom: 80px;}
#two_in_one div#staff .staff_box .col .ph {width: 260px;}
#two_in_one div#staff .staff_box .col .txt_area {width: 600px;}
#two_in_one div#staff .staff_box .col .txt_area .name {text-align: left;font-size: 14px;font-weight: 500;color: #FFF;margin-bottom: 0.5em}
#two_in_one div#staff .staff_box .col .txt_area .name span {font-size: 24px;margin-left: 1em;}
#two_in_one div#staff .staff_box .col .txt_area h4 {font-size: 18px;font-weight: 500;color: #FFF;text-align: left; margin-bottom: 0.5em;}
#two_in_one div#staff .staff_box .col .txt_area p {font-size: 14px;font-weight: 500;color: #FFF;text-align: left;margin-bottom: 0;}
/** ▲▲▲▲▲▲▲▲▲▲ staff ▲▲▲▲▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼▼▼▼▼ review ▼▼▼▼▼▼▼▼▼▼ **/
#two_in_one div#review {position: relative;width: 1000px;margin: 40px auto 0 auto;box-sizing: border-box; padding: 60px 40px;text-align: center;border-radius: 20px;background: #FFFFFF;}
#two_in_one div#review h2 {position: absolute;top: 0;right: 50px;display: flex;align-items: flex-start;justify-content: center;width: 40px;height: auto;padding: 0 0 0;}
#two_in_one div#review h2 img {width: 40px;}
#two_in_one div#review h3:before {content: "";display: inline-block;position: absolute;top: 105px;left: 50%;translate: -50% 0;width: 630px;height: 8px;border-radius: 4px;background: #D4AF37;}
#two_in_one div#review p {margin: 30px 0 40px 0;}

#two_in_one div#review div.review_inner {
    position: relative;
    width: 100%;
}

#two_in_one div#review a {
    font-size: 0.75em;
    font-weight: 500;
    transition: .3s;
    color: #000000;
}

#two_in_one div#review a:hover {
    color: #666666;
}
#two_in_one div#review .in_bottom {padding: 64px 0 0}
#two_in_one div#review .in_bottom h3 {font-size: 24px;font-weight: 500;text-align: center;margin-bottom: 16px;}
#two_in_one div#review .in_bottom p {font-size: 16px;font-weight: 500;text-align: center;line-height: 200%;margin: 0px;}
/** ▲▲▲▲▲▲▲▲▲▲ review ▲▲▲▲▲▲▲▲▲▲ **/

/** ▼▼▼▼▼▼▼▼▼▼ access ▼▼▼▼▼▼▼▼▼▼ **/
#access {}
#access ul.access_inner {display: flex;justify-content: center;width: 100%;height: 600px;}
#access ul li {width: 50%;}
#access ul li:nth-child(1) {display: flex;justify-content: flex-end;}
#access ul li:nth-child(1) div {position: relative;display: flex;align-items: center;justify-content: center;flex-direction: column;width: 500px;}
#access ul li:nth-child(1) div h2 {position: absolute;top: 0;left: 0;width: 40px;height:auto;padding: 0;}
#access ul li:nth-child(1) div h2 img {width: 40px;}
#access ul li:nth-child(1) div h3 {width: 234px;height: auto;}
#access ul li:nth-child(1) div h3 img {width: 100%;height: auto;}

#access ul li:nth-child(1) div span {font-size: 1.06em;letter-spacing: 0.12em;line-height: 100%;margin: 50px 0 0 0;}
#access ul li:nth-child(1) div ul.address {display: flex;justify-content: center;width: 440px;margin: 10px 0 0 0;}
#access ul li:nth-child(1) div ul.address li {letter-spacing: 0.1em;}

#access ul li:nth-child(1) div ul.address li:nth-child(1) {width: 25%;}
#access ul li:nth-child(1) div ul.address li:nth-child(2) {width: 70%;}

/** _/_/_/_/ about _/_/_/_/ **/
#access ul li:nth-child(1) div ul.access_about {display: flex;justify-content: space-between;flex-direction: column;width: 288px;height: 150px;margin: 30px 0 0 0;padding: 0;}
#access ul li:nth-child(1) div ul.access_about li {width: 100%;}  
#access ul li:nth-child(1) div ul.access_about li a.tel {display: flex;align-items: center;font-family: "Roboto", sans-serif;font-size: 2.12em;font-optical-sizing: auto;font-weight: 700;font-style: normal;font-variation-settings: "wdth" 100;letter-spacing: 0.02em;line-height: 100%;color: #000000;}  
#access ul li:nth-child(1) div ul.access_about li a.tel:before {content: "";display: block;width: 40px;height: 40px;margin: 0 10px 0 0;border-radius: 50%;background: #D4AF37 url("../manmaru_images/ico_tel_b.png") no-repeat center center;}  
#access ul li:nth-child(1) div ul.access_about li a.ask {display: flex;align-items: center;justify-content: center;width: 100%;height: 40px;border-radius: 20px;background: #e50012;font-weight: 700;color: #FFFFFF;transition: .3s;}
#access ul li:nth-child(1) div ul.access_about a.ask:hover {background: #993322;color: #FFFFFF;}
#access ul li:nth-child(1) div ul.access_about li:nth-child(2) {width: 100%; padding: 0 0 0 50px;font-size: 0.75em;line-height: 160%;}
/** _/_/_/_/ about _/_/_/_/ **/
/** ▲▲▲▲▲▲▲▲▲▲ access ▲▲▲▲▲▲▲▲▲▲ **/

img {width: 100%;height: auto;}

@media (max-width: 750px) {
	section {overflow: hidden;}
    /** ▼▼▼▼▼▼▼▼▼▼ farstview ▼▼▼▼▼▼▼▼▼▼ **/
	#farstview {margin-top: 80px;height: calc(100vh - 80px);background: url("../manmaru_images/mv_sp.png") no-repeat center center / cover;}
	#farstview ul.farstview_iner {width: 100%;height: 100%;position: relative;}
	#farstview ul.farstview_iner li h2 {position: absolute;top: 60px;left: 50%;translate: -50% 0;width: auto;height: calc(100% - 100px);}
	#farstview ul.farstview_iner li h2 img {width: auto;height: 100%;margin: 0 auto;}
    /** ▲▲▲▲▲▲▲▲▲▲ farstview ▲▲▲▲▲▲▲▲▲▲ **/

	/** ▼▼▼▼▼▼▼▼▼▼ about ▼▼▼▼▼▼▼▼▼▼ **/
	#about {background-color: #000;position: relative;}
	#about:before {content: none;}
	#about:after {content: none;}
	#about .inner {width: 100%;margin: 0 auto 140px;position: relative;}
	#about .inner .col2 {width: 100%;display:block;position: relative;}
	#about .inner .col2 .img_02 {width: 89%;box-sizing: border-box;padding: 96px 0 0;}
	#about .inner .col2 .img_02 img {width: 100%;height: auto;}
	#about .inner .col2 .img_01 {width: 76%;box-sizing: border-box;position: absolute;top:16px;right: 0;}
	#about .inner .col2 .img_01 img {width: 100%;height: auto;margin-top: 0px;}
	#about .inner .about_box {width: 90%;height: auto; aspect-ratio: 670 / 640;margin-left: 5%;margin-top: -40px;background-image: url("../manmaru_images/about_box_bk_sp.png");background-repeat: no-repeat;background-size: auto 100%;box-sizing: border-box;padding-left: 0;position: relative;}
	#about .inner .about_box .about_box_in {width: 100%;height: 100%;position: relative;box-sizing: border-box;padding: 12% 0;}
	#about .inner .about_box .about_box_in .tit.about {width: 8%;position: absolute;right: 0;top:-20px;}
	#about .inner .about_box .about_box_in .about_box_tit {width: 84%;margin: 0 11% 1em 5%;}
	#about .inner .about_box .about_box_in .txt {padding: 0 5%;font-size: 3.4vw;color: #572e12;}
	#about .inner .img_03 {width: 55%;height: auto;position: absolute;left: 10%;bottom:-88px;}
	#about .bnr_area {width: 100%;margin: 0 auto 0;position: relative;}
	#about .bnr_area .img_04 {width: 100%;height: auto;padding-bottom: 10%;}
	#about .bnr_area .img_04 img {width: 100%;}
	#about .bnr_area .img_05 {width: 45%;height: auto;position: absolute;right: 5%;top:-120px;}
	/** ▲▲▲▲▲▲▲▲▲▲ about ▲▲▲▲▲▲▲▲▲▲ **/

	/** ▼▼▼▼▼▼▼▼▼▼ menu ▼▼▼▼▼▼▼▼▼▼ **/
	#menu {background-color: #000;position: relative;box-sizing: border-box;padding: 0 0 10%;}
	#menu .menu_inner {width: 90%;margin: 0 auto 0;}
	#menu .menu_inner .head {display: block;position: relative;margin: 0 auto 48px;}
	#menu .menu_inner .head .tit.cuisine {width: 8%;position: absolute;left: 0;top:-20px;}
	#menu .menu_inner .head .cuisine_box_tit {width: 90%;margin: 0 auto 16px;}
	#menu .menu_inner .head p {font-size: 3.6vw;font-weight: 500;text-align: center;color: #FFF;}
	#menu .menu_inner .col2 {width: 100%;display:block;margin-bottom: 10%;}
	#menu .menu_inner .col2 .col {width: 100%;margin-bottom: 10%;}
	#menu .menu_inner .col2 .col .ph {width: 100%;margin: 0 auto 16px;}
	#menu .menu_inner .col2 .col .tit {font-size: 5.0vw;font-weight: 700;margin-bottom: 16px;color: #FFF;}
	#menu .menu_inner .col2 .col p {font-size: 3.2vw;font-weight: 700;color: #FFF;}
	#menu .menu_inner .cuisine_img03 {width: 90%;margin: 0 auto 0;}
	/** ▲▲▲▲▲▲▲▲▲▲ menu ▲▲▲▲▲▲▲▲▲▲ **/

	/** ▼▼▼▼▼▼▼▼▼▼ instore ▼▼▼▼▼▼▼▼▼▼ **/
	#instore {position: relative;padding: 18% 0 15% 0;background-image: url("../manmaru_images/store_box_bk.png");background-size: cover;}
	#instore .instore_inner {width: 100%;}
	#instore .instore_inner .tit_instore {width: 8%;position: absolute;right: 5%;top:0;}
	#instore .instore_inner .logo {width: 46%;margin: 0 auto 8%;}
	#instore .instore_inner .store_box_tit {width: 92%;margin: 0 auto 5%;}
	#instore .instore_inner p {font-size: 4.4vw;font-weight: 500;margin-bottom: 8%;text-align: center;}
	#instore .instore_inner .col2 {width: 90%;margin: 0 auto 0;display: block;}
	#instore .instore_inner .col2 .col {width: 100%;margin-bottom: 2%;}
	/** ▲▲▲▲▲▲▲▲▲▲ instore ▲▲▲▲▲▲▲▲▲▲ **/

	/** ▼▼▼▼▼▼▼▼▼▼ staff ▼▼▼▼▼▼▼▼▼▼ **/
	#two_in_one {padding: 0 0 88px 0;background: #000;}
	#two_in_one div#staff {position: relative;width: 90%;margin: 0 auto;padding: 12% 0 0;}
	#two_in_one div#staff h2 {position: absolute;top: 0;left: 0;width: 8%;height: auto;}
	#two_in_one div#staff h2 img {width: 100%;}
	#two_in_one div#staff h3 {width: 80%;margin: 0 auto 5%;}
	#two_in_one div#staff h4 {font-size: 5.0vw;font-weight: 500;margin-bottom: 24px;text-align: center;color: #FFF;}
	#two_in_one div#staff p {font-size: 3.0vw;font-weight: 500;letter-spacing: 0; margin-bottom: 8%;text-align: center;color: #FFF;}

	#two_in_one div#staff .staff_box {width: 100%;margin: 0 auto 64px;}
	#two_in_one div#staff .staff_box .col {width: 100%;display:block;}
	#two_in_one div#staff .staff_box .col:first-child {margin-bottom: 80px;}
	#two_in_one div#staff .staff_box .col .ph {width: 52%;margin: 0 auto 5%;}
	#two_in_one div#staff .staff_box .col .txt_area {width: 94%;margin: 0 auto 0;}
	#two_in_one div#staff .staff_box .col .txt_area .name {text-align: left;font-size: 3.4vw;font-weight: 500;color: #FFF;margin-bottom: 0.5em}
	#two_in_one div#staff .staff_box .col .txt_area .name span {font-size: 4.8vw;margin-left: 0em;display: block;}
	#two_in_one div#staff .staff_box .col .txt_area h4 {font-size: 4.0vw;font-weight: 500;color: #FFF;text-align: left; margin-bottom: 0.5em;}
	#two_in_one div#staff .staff_box .col .txt_area p {font-size: 3.2vw;font-weight: 500;color: #FFF;text-align: left;margin-bottom: 0;}
	/** ▲▲▲▲▲▲▲▲▲▲ staff ▲▲▲▲▲▲▲▲▲▲ **/

	/** ▼▼▼▼▼▼▼▼▼▼ review ▼▼▼▼▼▼▼▼▼▼ **/
	#two_in_one div#review {position: relative;width: 90%;margin: 5% auto 0 auto;padding: 8% 5%;text-align: center;border-radius: 20px;background: #FFFFFF;}
	#two_in_one div#review h2 {position: absolute;top: 0;right: 20px;display: flex;align-items: flex-start;justify-content: center;width: 8%;height: auto;padding: 0 0 0;}
	#two_in_one div#review h2 img {width: 100%;}
	#two_in_one div#review h3:before {content: "";display: inline-block;position: absolute;top: 105px;left: 50%;translate: -50% 0;width: 70%;height: 8px;border-radius: 4px;background: #D4AF37;}
	#two_in_one div#review p {margin: 30px 0 40px 0;font-size: 3.2vw;}

#two_in_one div#review div.review_inner {
}

#two_in_one div#review a {
    font-size: 0.75em;
    font-weight: 500;
    transition: .3s;
    color: #000000;
}

#two_in_one div#review a:hover {
    color: #666666;
}
	#two_in_one div#review .in_bottom {padding: 15% 0 0}
	#two_in_one div#review .in_bottom h3 {font-size: 4.8vw;font-weight: 500;text-align: center;margin-bottom: 3%;}
	#two_in_one div#review .in_bottom p {font-size: 3.2vw;font-weight: 500;text-align: center;line-height: 200%;margin: 0px;}
	/** ▲▲▲▲▲▲▲▲▲▲ review ▲▲▲▲▲▲▲▲▲▲ **/

    /** ▼▼▼▼▼▼▼▼▼▼ access ▼▼▼▼▼▼▼▼▼▼ **/
	#access {}
	#access ul.access_inner {display: block;width: 100%;height: auto;}
	#access ul li {width: 100%;}
	#access ul li:nth-child(1) {display: flex;justify-content: center;padding-bottom: 2.5%;}
	#access ul li:nth-child(1) div {position: relative;display: flex;align-items: center;justify-content: center;flex-direction: column;width: 100%;padding: 0 0 10%;}
	#access ul li:nth-child(1) div h2 {position: absolute;top: 0;left: 5%;width: 8%;height:auto;padding: 0;}
	#access ul li:nth-child(1) div h2 img {width: 100%;}
	#access ul li:nth-child(1) div h3 {width: 46%;height: auto;padding: 10% 0 0;}
	#access ul li:nth-child(1) div h3 img {width: 100%;height: auto;}

    #access ul li:nth-child(1) div span {font-size: 1.06em;letter-spacing: 0.12em;line-height: 100%;margin: 6% 0 0 0;}
	#access ul li:nth-child(1) div ul.address {display: flex;justify-content: center;width: 100%;margin: 10px auto 0;}
	#access ul li:nth-child(1) div ul.address li {letter-spacing: 0.1em;}
	#access ul li:nth-child(1) div ul.address li:nth-child(1) {width: 32%;display: flex;justify-content: flex-end;}
	#access ul li:nth-child(1) div ul.address li:nth-child(2) {width: 68%;display: flex;justify-content: flex-start;}

/** _/_/_/_/ about _/_/_/_/ **/
#access ul li:nth-child(1) div ul.access_about {display: flex;justify-content: space-between;flex-direction: column;width: 80%;height: auto;margin: 4% 0 0 0;padding: 0;}
#access ul li:nth-child(1) div ul.access_about li {width: 100%;}  
#access ul li:nth-child(1) div ul.access_about li a.tel {display: flex;align-items: center;font-family: "Roboto", sans-serif;font-size: 2.12em;font-optical-sizing: auto;font-weight: 700;font-style: normal;font-variation-settings: "wdth" 100;letter-spacing: 0.02em;line-height: 100%;color: #000000;}  
#access ul li:nth-child(1) div ul.access_about li a.tel:before {content: "";display: block;width: 40px;height: 40px;margin: 0 10px 0 0;border-radius: 50%;background: #D4AF37 url("../manmaru_images/ico_tel_b.png") no-repeat center center;}  
#access ul li:nth-child(1) div ul.access_about li a.ask {display: flex;align-items: center;justify-content: center;width: 100%;height: 40px;border-radius: 20px;background: #e50012;font-weight: 700;color: #FFFFFF;transition: .3s;}
#access ul li:nth-child(1) div ul.access_about a.ask:hover {background: #993322;color: #FFFFFF;}
#access ul li:nth-child(1) div ul.access_about li:nth-child(2) {padding: 0 0 1em 6.5em;font-size: 3.4vw;line-height: 160%;}
	#access ul li.map {width: 100%;height: auto;aspect-ratio:1 / 1;}
/** _/_/_/_/ about _/_/_/_/ **/
    /** ▲▲▲▲▲▲▲▲▲▲ access ▲▲▲▲▲▲▲▲▲▲ **/
}