@charset "utf-8";

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

/* reset css */
html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}body {line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block;}nav ul {list-style:none;}blockquote, q {quotes:none;}blockquote:before, blockquote:after,q:before, q:after {content:'';content:none;}a {margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}/* change colours to suit your needs */ins {background-color:#ff9;color:#000;text-decoration:none;}/* change colours to suit your needs */mark {background-color:#ff9;color:#000; font-style:italic;font-weight:bold;}del {text-decoration: line-through;}abbr[title], dfn[title] {border-bottom:1px dotted;cursor:help;}table {border-collapse:collapse;border-spacing:0;}/* change border colour to suit your needs */hr {display:block;height:1px;border:0; border-top:1px solid #cccccc;margin:1em 0;padding:0;}input, select {vertical-align:middle;}


/*
 * defaut style
 */
html { height:100%; overflow-y:scroll;  font-size:2.65vw; letter-spacing:-0.03rem; }
body { color:#564b6d;  word-wrap:break-word; background:#fff;}
body { font-family:'Noto Sans JP',	"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
table { word-break:break-word; } 
img,input[type=image],video { max-width:100%; height:auto; width:auto; vertical-align:bottom; border:none; }
li { list-style-type:none; }
ol li {  margin-left:20px; padding-left:5px; list-style-type:decimal; margin-bottom:0.5em; }
p { margin-bottom:1.5em; line-height:150%; }
p:last-child { margin-bottom:0; }
a { color: inherit; text-decoration: none; }
sup { position:relative; font-size:100%; top:-5px; }
sub { position:relative; font-size:100%; bottom:-5px; }
.clearfix { *zoom: 1; }
.clearfix:after { content: ''; display: block; clear: both; height: 0; margin-top: -1px; }
.pc { display:none!important; }
.sp { display:block; }
img.sp { display:inline-block; }
.center { text-align:center; }
.right { text-align:right; } 
strong { /* color:#C00; */ }
em { /* color:#960; */ font-weight:bold; font-style:normal; }
* { box-sizing:border-box; }
.container iframe {/*  max-width:100%; height:200px; */ }
iframe[name=google_conversion_frame] { display:none; }


#loader-bg {
  display: none;
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  background: #fff;
  z-index: 999;
}
#loader {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  width: 29px;
  height: 29px;
  margin-top: -14px;
  margin-left: -14px;
  text-align: center;
  color: #333;
  z-index: 1000;
}




/*
 * header & footer
 */
#container { position:relative; z-index:2; }
body.loading #container { visibility:hidden; }


#header .header-gnav { /* display:none; */ position:absolute; z-index:3; width:100%; background:#e94c2f; top:0; padding-top:0px; height:calc(0px); overflow: auto; -webkit-overflow-scrolling: touch; transition:0.5s ease-in-out; }
#header .header-gnav.isopen { height:calc(100vh - 40px); padding-top:40px; /* display:block; */ }
#header .header-gnav > ul { margin:0 9.375%; }
#header .header-gnav > ul > li > a { line-height:140%; display:block; color:#fff; border-bottom:1px solid #fff; padding:2rem 0; font-weight:bold; text-align:center; }
#header .header-gnav > ul > li > a > img {  width:33.65384615384615%; }
#header .header-gnav > ul > li .sub { display:block!important; }
#header .header-gnav > ul > li .sub > ul > li > a { line-height:140%; display:block; color:#fff; background:#3c3c3c; border-bottom:1px solid #444; padding:8px 20px 8px 30px; font-size:12px; }
#header #sp-menu .btn { display:block!important; z-index:4; cursor:pointer; width:9.0625%; position:absolute; right:10px; top:10px; transition:0.3s ease-in-out; }
#header #sp-menu.isopen .btn { background:url(../img/sp/btn_sp_menu_close.png) no-repeat!important; background-size:cover!important; }
#header #sp-menu.isopen .btn img { opacity:0; }



#footer { position:relative; padding-bottom:14rem; }
#footer .pagetop { position:fixed; z-index:99; right:10px; bottom:9rem; max-width:90px; transform:translateY(360%); transition:0.5s ease-in-out; width:10.9375%; }
#footer .pagetop.show { transform:translateY(0%); }
#footer .pagetop img { width:100%; }
#footer .app-footer { background:#f4d120; padding:1.5rem 0; }
#footer .app-footer > .inner { max-width:1100px; margin:0 auto; }
#footer .app-footer .box { position:relative; max-width:59.84375%; margin:0 auto; }
#footer .app-footer .app-icon { width:21.80851063829787%; position:absolute; left:0; top:0; }
#footer .app-footer .app-spec { padding-left:27.65957446808511%; }
#footer .app-footer .app-dl { position:relative; margin-top:1.5rem; }
#footer .app-footer .app-dl li:nth-child(1) { width:46.54255319148936%; }
#footer .app-footer .app-dl li:nth-child(2) { width:49.20212765957447%; position:absolute; right:0; top:0; }
#footer .copy-footer > .inner { max-width:1100px; margin:0 auto; }
#footer .sns { text-align:center; margin:3rem 0 2rem; }
#footer .sns li { width:10%; margin-right:3.90625%; }
#footer .sns li:last-child { margin-right:0; }
#footer .corp-logo { display:block; margin:1.5rem 0; text-align:center; }
#footer .corp-logo li { display:inline-block; }
#footer .corp-logo li:nth-child(1) { width:28.75%; margin-right:4%; }
#footer .corp-logo li:nth-child(2) { width:37.65625%; }

#footer .copyright { text-align:center; }


/*
 * contents
 */
.contents { }
.content-wrapper { }
.main-content { overflow-x: hidden; }


/* anime */
@keyframes move-x {
    0% { transform:translateX( -60.5%); }
  100% { transform:translateX(  0px); }
}

@keyframes move-x2 {
    0% { transform:translateX( 7.5%); }
  100% { transform:translateX(  0px); }
}


@keyframes baunce-ex {
	
  0% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
  20% {
    transform:  scaleX(1.08) scaleY(1.08) ;
  }
  26% {
    transform:  scaleX(0.90) scaleY(0.90) ;
  }
  35% {
    transform:  scaleX(1.05) scaleY(1.05) ;
  }
  42% {
    transform:  scaleX(0.95) scaleY(0.95) ;
  }
  49% {
    transform:  scaleX(1.03) scaleY(1.03) ;
  }
  55% {
    transform:  scaleX(0.98) scaleY(0.98) ;
  }
	60% {
    transform:  scaleX(1.00) scaleY(1.00) ;
  }
}



/* 汎用 */
.red { color:#e71f19; }
.green { color:#009d42; }
.blue { color:#0099ff; }
.note { line-height:140%; }
.underline { text-decoration:underline; }
.underline:hover { text-decoration:none; }
.btn01 a { display:block; width:62.2%; margin:0rem auto 1.8rem; border:2px solid #76491b; background:#fff; color:#76491b; border-radius:50px; font-size:1.875rem; padding:2rem; position:relative; text-align:center; }
.btn01 a:after { display:block; content:""; background:url(../img/ico_arrow01.png) no-repeat left top; background-size:cover; width:20px; height:22px; position:absolute; right:3.89408099688474%; top:50%; transform:translateY(-50%);	}
.btn01 a:hover { text-decoration:none; opacity:0.7; }

body > .canvas {
    position: fixed;
		z-index:1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
		opacity:0.5;
}

.special-area > .canvas2 {
	position: absolute;
	z-index:1;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity:1;
}

canvas {
    display: block;
}

/* content */
.sns {position: absolute;top: 15px;right: 0;z-index: 3;}
.sns ul {font-size: 0;}
.sns ul li {display: inline-block;}
.sns ul li:not(:last-of-type) {margin-right: 10px;}
#footer .sns {position: static; }


.visual-area { position:relative; height: 143vw; background: url(../img/bg-sp.jpg) no-repeat; background-size: contain;}
.visual-area > .inner { max-width:1020px; margin:0 auto; padding-top:1px; }
.visual-area .bg-sp { position: absolute; bottom: 4%; left: 0;}
.visual-area .video-wrapper { position: absolute; left:0; top:0; width:100%; height:100%; overflow:hidden;}
.visual-area .video-wrapper #videoSP{display:none;}
.visual-area h1{ position: absolute; top: 22%; left: 0; } 
.visual-area .ball{ position: absolute; top: 27%; left: 83%; width: 8.3%; z-index: 2;} 
.visual-area .note{ position: absolute; top: 22.5%; left: 81%; width: 16.4%}
.visual-area .train { position: absolute; top: 32.5%; left: 0;}
.visual-area .load { position: absolute; top: 38.5%; left: 0;}
.visual-area .catch { position: absolute; top: 55.5%; left: 0;}
.visual-area .notes { width:20.3125%; position:absolute; left:78.901961%; top:0%; margin-top:26rem; }
.visual-area .notes:hover { opacity:0.7; }

.visual-area .title01,
.visual-area .title02,
.visual-area .title03,
.visual-area .title04,
.visual-area .title05,
.visual-area .catch,
.visual-area .notes  { opacity:0; }


.menu-area { display:none; }

.btn-ticket { /*position:relative; width:100%; margin:0 auto; z-index:20;*/ }
.btn-ticket > .btn { /*position:absolute; right:50px; top:0; width:20%;*/ }
.btn-ticket .btn { position:fixed; right:0px; bottom:10px; z-index:20; transform:translate(-50%,120%); transition:0.5s ease-in-out; width:93.75%; left:50%;  }
.btn-ticket .btn.show { transform:translate(-50%,0%); }


.notice-area > .inner { max-width:1100px; margin:0 auto; position:relative; padding:0 0 2rem; }
.notice-area .box { background:#ffc3e3; font-size:1.125rem; margin:1.9rem 1.81818181818182%; padding:2rem 1.81818181818182%; }
.notice-area .box p { line-height:180%; }


.notice{
	position: relative;
	padding-top: 50px;
}
.notice .inner{
	width: 94%;
	margin: 0 auto;
}
.notice h2{
	margin-bottom: 30px;
	font-size: 4.6vw;
	text-align: center;
	line-height: 1.2;
}
.notice p{
	font-size: 2.8vw;
	margin-bottom: 30px;
	text-align: center;
}
.notice p:last-child {
	margin-bottom: 80px;
}
.notice::after{
	display: block;
	content: '';
	width: 90%;
	height: 1px;
	background-color: #333;
	margin: 0 auto;
}


.cast-area > .inner { max-width:1100px; margin:0 auto; position:relative; padding: 20% 0 25.3%; }
.cast-area h2 { width:78.454545%; margin:0 auto 5%; }
.cast-area h3 { margin: 0 auto 6%; text-align: center;} 
.cast-area ul { font-size: 0; text-align: center;}
.cast-area ul li {display: inline-block;}
.cast-area ul li .name { font-size: 6.57vw;; text-align: center; line-height: 1; color: #e94c30;}
.cast-area ul li .name span { display: block; font-size: 2.82vw; line-height: 1.5; letter-spacing:1px;}
.cast-area .list02 ul li .name { font-size: 5.79vw;}
.cast-area .list02 ul li .name span { font-size: 3.29vw;}
.cast-area ul.cast { width: 98%; margin: 0 auto;}
.cast-area .list01 { margin-bottom: 20%;}
.cast-area .list01 h3 { width: 21.2%;} 
.cast-area .list01 ul.character {margin-bottom: 4%;}
.cast-area .list01 ul.character li {vertical-align: middle;}
.cast-area .list01 ul.character li:nth-child(1) { width:17.5%; margin-right: 3.9%;}
.cast-area .list01 ul.character li:nth-child(2) {  width: 19.8%; margin-right: 6.3%}
.cast-area .list01 ul.character li:nth-child(3) { width: 16.4%; margin-right: 2.4%;}
.cast-area .list01 ul.character li:nth-child(4) { width: 20.2%; }
.cast-area .list01 ul.cast li { width: 42.1%; margin-bottom: 5.5%;}
.cast-area .list01 ul.cast li .img { width: 66.3%; margin: 0 auto;}
.cast-area .list01 ul.cast li:nth-child(2n){ margin-right: 0;}
.cast-area .list02 { margin-bottom: 20%;}
.cast-area .list02 h3 { width: 26.8%;} 
.cast-area .list02 ul.character {margin-bottom: 4%;}
.cast-area .list02 ul.character li:nth-child(1) { width: 16.4%;}
.cast-area .list02 ul.character li:nth-child(2) { width: 18.9%;}
.cast-area .list02 ul.character li:nth-child(3) { width: 12.4%;}
.cast-area .list02 ul.character li:nth-child(4) { width: 13%;}
.cast-area .list02 ul.character li:nth-child(5) { width: 15%;}
.cast-area .list02 ul.character li:nth-child(6) { width: 17.8%;}
.cast-area .list02 ul.cast li { width: 30%;  margin-right: 5%; margin-bottom: 5.5%;}
.cast-area .list02 ul.cast li .img { width: 96%; margin: 0 auto;}
.cast-area .list02 ul.cast li:nth-child(3){ margin-right: 0;}
.cast-area .list02 ul.cast li:last-child{ margin-right: 0;}
.cast-area .list03 { margin-bottom:20%;} 
.cast-area .list03 h3 { width: 24.6%;} 
.cast-area .list03 ul.character {width:95%;margin: 0 auto 4%;}
.cast-area .list03 ul.character li:nth-child(1) { width: 29.7%;}
.cast-area .list03 ul.character li:nth-child(2) { width: 35.6%;}
.cast-area .list03 ul.cast li {width: 43.4%; }
.cast-area .list03 ul.cast li .img {width: 64.5%; margin: 0 auto; }
.cast-area .list04 { width: 90%; margin: 0 auto 4%; padding: 3% 0 0; background-color: #f5f4f6; border-radius: 25px;}
.cast-area .list04 p {font-size: 5.6vw; color: #564b6d; margin-bottom: 3%; text-align: center;}
.cast-area .list04 li { position: relative; width: 40%; margin: 0 2% 4%; }
.cast-area .list04 li .chara { width: 85.2%; margin: 0 auto 5%;}
.cast-area .list04 li .chara img {width: 100%;}
.cast-area .list04 li .cast { position: absolute; top: 48%; right: -10%; width: 53.5%;}
.cast-area .list04 li .name { font-size: 5vw; margin-left: 6.5%; text-align: left;}
.cast-area .list04 li .name span {font-size: 2.5vw;}
.cast-area .text {margin-bottom: 9.4%;}
.cast-area #more-text {position: relative; height: 8vw; width: 60.5%; margin: 0 auto 5%;}
.cast-area #more-text p { position: absolute;}
.cast-area #more-text p.text1 {width:5%; top: 0; left: -1.5%;}
.cast-area #more-text p.text2 {width:5%; top: 0; left: 4%;}
.cast-area #more-text p.text3 {width:5%; top: 0; left: 9.5%;}
.cast-area #more-text p.text4 { width: 10%; top: 0; left: 15.5%;}
.cast-area #more-text p.text5 {width: 8.4%; top: 0; left: 26.5%;}
.cast-area #more-text p.text6 { width: 10%; top: 0; left: 36%}
.cast-area #more-text p.text7 { width:13.70%; top: 0; left: 51.8%}
.cast-area #more-text p.text8 { width: 10%; top: 0; left: 66.5%}
.cast-area #more-text p.text9 { width: 4.2%; top: 0; left: 77.5%}
.cast-area #more-text p.text10 { width: 9.8%; top: 0; left: 82%}
.cast-area #more-text p.text11 { width: 2%; top: 0; left: 94.5%}
.cast-area #more-text p.text12 { width: 2%; top: 0; right: 0;}
	
.ticket-area > .inner { max-width:1100px; margin:0 auto; position:relative; padding:2rem 0 0rem; }
.ticket-area h2 { width:37%; margin:0 auto 4rem; }
.ticket-area h3 { width:67.8125%; margin:2rem auto 0; }
.ticket-area .btn { width:68.75%; margin:1.5rem auto; }
.ticket-area .btn:hover { opacity:0.7; }
.ticket-area .txt04 { margin-bottom: 3%; padding-top: 3%; }
.ticket-area .notes { width:20.3125%; position:absolute; left:75%; top:-4%; }
.ticket-area .notes:hover { opacity:0.7; }
.cd-info { background:#f5f4f6; width:93.75%; margin:0 auto 5%; padding:3.125%; position:relative; }
.cd-info .thumb { width:25.35714285714286%; }
.cd-info .texts { width:65.5%; position:absolute; top:-1rem; left:29.75%; padding-top: 7%; }
.ticket-caption { font-size:0.875rem; margin:2rem 0 0; }


.goods-area { }
.goods-area > .inner { max-width:1100px; margin:0 auto; position:relative; padding:4rem 0; }
.goods-area h2 { width:45.8%; margin:0 auto 4rem; }
.goods-list { position:relative; margin:1.5rem 0 2.5rem; display:flex; flex-wrap: wrap; }
.goods-list:last-child { margin-bottom:0; }
.goods-list .item { position:relative; margin-left:3.90625%; margin-bottom:2rem; width:45.15625%; }
.goods-list .item:nth-child(2n+1) { margin-left:3.125%; }
.goods-list .item:before { display:block; content:""; position:absolute; left:0; top:0; background:url(../img/img_good_lt.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; transition:0.1s ease-in-out;}
.goods-list .item:after { display:block; content:""; position:absolute; right:0; top:0; background:url(../img/img_good_rt.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; transition:0.1s ease-in-out;}
.goods-list .item .img { position:relative; background:#fff; }
.goods-list .item .img:before { display:block; content:""; position:absolute; left:0; bottom:0; background:url(../img/img_good_lb.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; transition:0.1s ease-in-out;}
.goods-list .item .img:after { display:block; content:""; position:absolute; right:0; bottom:0; background:url(../img/img_good_rb.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; transition:0.1s ease-in-out;}
.goods-list a.item:hover:before { left:-5px; top:-5px; background:url(../img/img_good_lt_on.png) no-repeat; }
.goods-list a.item:hover:after { right:-5px; top:-5px; background:url(../img/img_good_rt_on.png) no-repeat; }
.goods-list a.item:hover .img:before { left:-5px; bottom:-5px; background:url(../img/img_good_lb_on.png) no-repeat; }
.goods-list a.item:hover .img:after { right:-5px; bottom:-5px; background:url(../img/img_good_rb_on.png) no-repeat; }
.goods-list .item .text { position:absolute; bottom:0; width:100%; }
.goods-list .item .name { font-size:1.125rem; text-align:center; margin-bottom:0.2rem; font-weight:600; line-height:120%; }
.goods-list .item .size { font-size:0.875rem; text-align:center; margin-bottom:1rem; margin-bottom:0.2rem; font-weight:300; letter-spacing:1px; line-height:120%; }
.goods-list .item .size span { font-size:0.75rem; }
.goods-list .item .price { font-size:1.625rem; text-align:center; display:block; margin:0 0 0.2rem;  }
.goods-list .item .price span { font-size:1rem; }
.good-caption { margin-top:-10px; }
.goods-list .coming-soon {width: 93.5%; margin: 0 auto;}

.goods-area .box { position:relative; width:93.75%; height:30rem; margin:-1rem auto 0; }
.goods-area .box:before { display:block; content:""; position:absolute; left:0; top:0; background:url(../img/img_good_lt.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; }
.goods-area .box:after { display:block; content:""; position:absolute; right:0; top:0; background:url(../img/img_good_rt.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; }
.goods-area .box > .inner:before { display:block; content:""; position:absolute; left:0; bottom:0; background:url(../img/img_good_lb.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; }
.goods-area .box > .inner:after { display:block; content:""; position:absolute; right:0; bottom:0; background:url(../img/img_good_rb.png) no-repeat; background-size:auto; width:20px; height:20px; z-index:2; }
.goods-area .box > .inner > div { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:73.83333333333333%; }
.goods-area .cs { width:93.75%; margin:2rem auto 0; }


.modal { border:1px solid #564b6d; background:#fff; }
.modal .bg { position:fixed; left:0; top:0; width:100%; height:100%; z-index:-1; pointer-events:none; background:rgba(255,255,255,0.9);}
.mfp-close-btn-in .mfp-close { color:#564b6d; }

.special-area { background:#ff9f36; position:relative; overflow:hidden; }
.special-area .wrapper { background:#ff9f36; overflow:hidden; position:relative; }
.special-area .wrapper > .inner { max-width:1100px; margin:0 auto; position:relative; padding:2rem 0 4rem; z-index:2; }
.special-area h2 { width:47%; margin:0 auto 4rem; }
.special-area h3 {font-size: 4.2vw; font-weight: bold; line-height: 1.4; color: #fff; margin-bottom: 4%;}
.special-area .food {margin-bottom: 14%; padding: 0 3%; text-align: center;}
.special-area .food .block {margin-bottom: 14%;}
.special-area .food .block p {font-size: 3.5vw; color: #fff;}
.special-area .food .block .image {margin-bottom: 5%;}
.special-area .food .block .text { padding: 0 4%; text-align: left; margin-bottom: 0;}
.special-area .food .block .text p { text-indent: -1em; padding-left: 1em; margin: 0;}
.special-area .food .block .text p.note {text-indent: 0;}
.special-area .food .block:nth-of-type(1) .text p:nth-child(2) {text-indent: 0; padding-left: 0; margin-bottom: 4%;}
.special-area .video-box { }
.special-area .video-box h4 { font-size: 3.8vw; color:#FFFFFF; text-align:center; line-height: 1.5; font-weight:normal; }
.special-area .video-box .video { width:93.75%; height:20rem; margin:1.5rem auto 0rem; position:relative; z-index:2; }

.access-area > .inner { max-width:1100px; margin:0 auto; position:relative; padding:2rem 0 1.5rem; }
.access-area h2 { width:78.454545%; margin:0 auto 2rem; }
.access-area .address { text-align:center; line-height:220%; }
.access-area .addr01 { font-size:2.025rem; margin-bottom:0.4rem; font-weight:bold; }
.access-area .addr02 { font-size:1.4rem; }
.access-area .addr03 { font-size:1.3rem; }
.access-area .map iframe { width:93.75%; height:30rem; margin:0 auto; display:block; }

.notes-area > .inner { max-width:1100px; margin:0 auto; position:relative; padding:2rem 0 4rem; }
.notes-area h2 { width:78.454545%; margin:0 auto 1rem; }
.notes-area p { margin:0 4%; line-height:2; font-size:1.3rem; }
.notes-area h3 { font-size:1.75rem; color:#e94c30; font-weight:400; margin: 4% 4% 3%; border-bottom: 2px dotted; padding-bottom: 2%;}
.notes-area h3 span { position: relative; }
.notes-area h3 span::after { content:"▼"; font-size: 20px; position: absolute; top: 10%; right: -2rem;}
.notes-area h3.active span::after { content:"▲"; font-size: 20px; position: absolute; top: 10%; right: -2rem;}
.notes-area .box {display: none;}
.notes-area .box p { text-indent: -1rem; padding-left: 1rem;}
.notes-area .box p.text {padding-left: 0; text-indent: 0; margin-bottom: 2rem;}
.notes-area ul { margin: 0 4%; padding-left: 1rem;}
.notes-area ul li { line-height: 2; font-size:1.3rem;}

}