@charset "utf-8";
/*-------------------------------------------------
content Style Sheet
Version : 1.0
Author : myeong-hee park
Create date : 2016. 8. 18.
Last update : 2016. 8. 18.
-------------------------------------------------*/
#detail_content {
	font-size: 14px;
	}	
#ui-datepicker-div {
	z-index: 90 !important;
	}	
.rolypoly_outline {
	padding-right: 305px;
	background: url(../../images/rol/content/rolypoly_outline.jpg) no-repeat right 0;	
	}	
.application_info {
	margin-bottom: 45px;
	letter-spacing: -0.07em;
	}		
.application_info dt {
	margin-bottom: 15px;
	color: #6f7483;
	font-size: 1.286em;
	font-weight: bold;	
	}	
.rolyPoly_application {
	height: 589px;
	padding: 36px 106px 0;
	background: url(../../images/rol/content/rolyPoly_application.jpg) no-repeat center 0;
	overflow: hidden;
	}	
.rolyPoly_application > li {
	position: relative;
	float: left;
	width: 137px;
	height: 137px;
	text-align: center;
	}
.rolyPoly_application > li:before {
	display: block;
	position: absolute;
	top: 0;
	width: 137px;
	height: 137px;
	background: #f9671a;
    border-radius: 80px;
    opacity: .2;
	content:'';
	}
.rolyPoly_application > li:nth-child(2) {
	float: right;
	}
.rolyPoly_application > li:nth-child(2):before {
	background: #6da516;
	}
.rolyPoly_application > li a {
	position: relative;
    display: block;
	padding: 52px 0 38px;
	background: url(../../images/rol/content/rolyPoly_application_round.png) no-repeat 0 0;
	}
.rolyPoly_application > li:nth-child(2) a {
	background-position: right 0;
	}
.rolyPoly_application > li:hover:before {	
	animation: lms-circle 1s ease infinite;
	}
@keyframes lms-circle {
  100%   { transform:scale(1.35); opacity:0; }
}	
.classify_info > p {
	margin-bottom: 23px;
	}
/* 식사구성평가 */	
.rolypoly_area {
	}
.rolypoly_area:after{
	clear:both;
	display:block;
	content:"";
	}	
.rolypoly_area > .float_left {
	width: 230px;
	margin: 10px 30px 0 0;
	padding-bottom: 34px;
	background: url(../../images/rol/content/scales.gif) no-repeat center bottom;	
	}
.middle_manager {
	margin-bottom: 20px;
	padding: 15px;
	border: solid 5px #eff0f2;
	}	
.middle_manager > span {
	margin-bottom: 5px;
	}
.middle_manager .input_long03 {
	width: 154px;
	text-align: center;
	}	
.middle_manager .ui-datepicker-trigger {
	margin-left: 5px;
	}
.middle_manager > .input_long {
	width: 96%;
	}	
.middle_manager > span select {
	width: 48%;
	}
.middle_manager > span.btn_area {
	margin-top: 5px;
	}	
.character {
	position: relative;	
	margin-left: 3px;
	transform-origin:center 69%;
    transition: all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	-webkit-transform-origin:center 69%; 
	-webkit-transition: all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	}	
.character.lack {
	-webkit-transform:rotate(-15deg); 
	transform:rotate(-15deg);
	}	
.character.over {
	-webkit-transform:rotate(15deg); 
	transform:rotate(15deg);	
	}		

.rolypoly_area .kcal {
	width: 88px;
	height: 22px;
	margin: 12px auto 6px;
	text-align: right;
	overflow: hidden;
	}
.rolypoly_area .kcal span {
	display: block;
	float: left;
	}	
.rolypoly_area .kcal .num {
	width: 55px;
	padding-right: 5px;
	overflow: hidden;
	}
.rolypoly_area .kcal .unit {
	color: #252425;
	line-height: 1.5;
	}
.character .face .hair{
	display:block;
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	background: url("../../images/rol/content/year3_youngHair.png") no-repeat 0 0;
	z-index: 5;
	}
.character .face .eyebrow,
.character .face .eyes,
.character .face .glasses,
.character .face .slash,
.character .face .cheek,
.character .face .mouse{
	display:block;
	position:absolute;	
	left: 50%;
	background: no-repeat 0 0;
	z-index: 4;
	}
.character .face .cheek{
	z-index:2;
	}
.character .face {
	display: block;
	position: relative;
	width: 145px;
	height: 180px;
	margin: auto;
	background: url("../../images/rol/content/face.png") no-repeat 0 0;
	z-index: 2;
	}
.character .face:before {
	content:"";
	display:block;
	position:absolute;
	width:100%;
	height:100%;
	opacity:0;
	-webkit-transition:opacity 1s ease;	transition:opacity 1s ease;
	z-index:3;
}
.character.lack .face:before {	
	background: url("../../images/rol/content/face_lack.png") no-repeat 0 0;
	opacity:1;
	}	
.character.over .face:before {
	background: url("../../images/rol/content/face_over.png") no-repeat 0 0;
	opacity:1;
	}
.character .face .eyebrow{
	opacity:0;	
	top:74px;
	margin-left:-30px;
	width:59px;
	height:8px;	
	background-image: url("../../images/rol/content/eyebrow.png");
	-webkit-transform:translateY(-5px);
	transform:translateY(-5px);
	-webkit-transition:all .3s ease;
	transition:all .3s ease;	
	}	
.character.lack .face .eyebrow,
.character.over .face .eyebrow {
	opacity:1;
	-webkit-transform:translateY(0px);
	transform:translateY(0px);
	}
.character .face .eyes {
	top:81px;
	margin-left:-30px;
	width:60px;	
	-webkit-animation:eyes 1.2s ease infinite;
	animation:eyes 1.2s ease infinite;	
}
@-webkit-keyframes eyes {
	0%{-webkit-transform:scaleY(1);}
	10%{-webkit-transform:scaleY(0);}
	20%{-webkit-transform:scaleY(1);}
}
@keyframes eyes {
	0%{transform:scaleY(1);}
	10%{transform:scaleY(0);}
	20%{transform:scaleY(1);}
}

.character .face .glasses{
	top:70px;
	width:116px;
	height:66px;
	margin-left:-58px;
	background-image: url("../../images/rol/content/glasses.png");
	display:none;
	}
.character .face .cheek {
	top:100px;
	width:77px;
	height:20px;
	margin-left:-39px;
	background-image: url("../../images/rol/content/cheek.png");
	}
.character .face .mouse {
	top:120px;
	width:31px;
	height:14px;
	margin-left:-15px;
	background-image: url("../../images/rol/content/mouse.png");
	}
.character.lack .face .mouse {	
	background-position: 0 -14px;
	}
.character.over .face .mouse{	
	background-position:0 -28px;
	}
.character .water_cup	{
	display:block;
	position:absolute;
	right:41px;
	top:15px;
	width:52px;
	height:50px;
	background:url("../../images/rol/content/water_cup.gif") no-repeat 0 0;
	z-index:1;
	}
.year3_young .water_cup,
.year6_woman .water_cup{
	top:18px;
	right:45px;
	}	
.character .neck {
	display:block;
	position:absolute;
	left:50%;
	top:142px;
	width:145px;
	height:37px;
	margin-left:-72px;
	background: url("../../images/rol/content/year3_youngNeck.png") no-repeat center 0;
	}
.foodBody {
	width: 225px;
	height: 226px;
	margin-top: -33px;
	background: url("../../images/rol/content/year3_youngBody.png") no-repeat center 0;
	}
.foodBody > li {	
	overflow: hidden;	
	}
.foodBody > li > div {	
	float: left;
	}	
.foodBody > li .fruits {	
	float: right;
	}		
.foodBody > li:nth-child(1) {
	height: 65px;	
	}
.foodBody > li:nth-child(2) {
	height: 60px;
	margin-top: -18px;
	}
.foodBody > li:nth-child(3) {
	height: 105px;
	margin-top: -30px;
	}
.foodBody > li:nth-child(4) {
	height: 71px;
	margin-top: -27px;
	}
/* 머리크기가 달라서 아래기준으로 맞추기위한 상단 여백 */	
.year3_young .face,
.year6_man .face,
.year6_woman .face{top:7px;}
.year3_young .neck,
.year6_man .neck,
.year6_woman .neck{top:149px;}
.year3_young .water_cup, .year6_woman .water_cup, .year6_woman .water_cup{top:25px;}


/* 3~5살 소아 */
.year3_young .face .hair{
	background-image: url("../../images/rol/content/year3_youngHair.png");
	}
.year3_young .neck{
	background-image: url("../../images/rol/content/year3_youngNeck.png");
	}	
.year3_young .foodBody {	
	background-image: url("../../images/rol/content/year3_youngBody.png");
	}	

/* 3살, 6~11 남 */
.year3_young .dairy,
.year6_man .dairy {
	width: 148px;
	}	
.year3_young .fruits,
.year6_man .fruits {
	width: 113px;	
	margin-left: -36px;	
	}	

/* 6~11 여, 12~18 남 여, 19~29 남 여, 65~74 남 여*/
.year6_woman .dairy,
.year12_man .dairy,
.year12_woman .dairy,
.year19_man .dairy,
.year19_woman .dairy,
.year65_man .dairy,
.year65_woman .dairy {
	width: 112px;
	}	
.year19_man .fruits {
	width: 165px;	
	margin-left: -52px;
	}
.year19_woman .fruits {
	width: 149px;
	margin-left: -36px;
	}	
/* 6~11살 남자 */	
.year6_man .face .hair{
	background-image: url("../../images/rol/content/year6_manHair.png");
	}
.year6_man .neck{
	background-image: url("../../images/rol/content/year6_manNeck.png");
	}
.year6_man .foodBody {
	background-image: url("../../images/rol/content/year6_manBody.png");
	}
/* 6~11살 여자 */	
.year6_woman .face .hair{
	background-image: url("../../images/rol/content/year6_womanHair.png");
	}	
.year6_woman .neck{
	background-image: url("../../images/rol/content/year6_womanNeck.png");
	}
.year6_woman .foodBody {
	background-image: url("../../images/rol/content/year6_womanBody.png");
	}
/* 12~18살 남자 */	
.year12_man .face .hair{
	background-image: url("../../images/rol/content/year12_manHair.png");
	}	
.year12_man .neck{
	background-image: url("../../images/rol/content/year12_manNeck.png");
	}
.year12_man .foodBody {
	background-image: url("../../images/rol/content/year12_manBody.png");
	}
/* 12~18살 여자 */	
.year12_woman .face .hair{
	left:-8px;
	background-image: url("../../images/rol/content/year12_womanHair.png");
	}
.year12_woman .neck{
	background-image: url("../../images/rol/content/year12_womanNeck.png");
	}
.year12_woman .foodBody {
	background-image: url("../../images/rol/content/year12_womanBody.png");
	}
/* 19~64살 남자 */	
.year19_man .face .hair{
	background-image: url("../../images/rol/content/year19_manHair.png");
	}
.year19_man .neck{
	background-image: url("../../images/rol/content/year19_manNeck.png");
	}
.year19_man .foodBody {
	background-image: url("../../images/rol/content/year19_manBody.png");
	}
/* 19~64살 여자 */	
.year19_woman .face .hair{
	background-image: url("../../images/rol/content/year19_womanHair.png");
	}
.year19_woman .neck{
	background-image: url("../../images/rol/content/year19_womanNeck.png");
	}	
.year19_woman .foodBody {
	background-image: url("../../images/rol/content/year19_womanBody.png");
	}
/* 65살 남자 */	
.year65_man .face .hair{
	background-image: url("../../images/rol/content/year65_manHair.png");
	}		
.year65_man .neck {
	background-image: url("../../images/rol/content/year65_manNeck.png");
	}
.year65_man .foodBody {
	background-image: url("../../images/rol/content/year65_manBody.png");
	}
.year65_man.over .glasses,
.year65_woman.over .glasses{
	background-image: url("../../images/rol/content/glasses_over.png");
	}	
/* 65살 여자 */	
.year65_woman .face .hair{
	background-image: url("../../images/rol/content/year65_womanHair.png");
	}
.year65_woman .neck{
	background-image: url("../../images/rol/content/year65_womanNeck.png");
	}	
.year65_woman .foodBody {
	background-image: url("../../images/rol/content/year65_womanBody.png");
	}		

/* 홍조 없애기 */
.year12_man .face .cheek,
.year12_woman .face .cheek,
.year19_man .face .cheek,
.year65_man .face .cheek,
.year65_woman .face .cheek{
	display:none;
	}
/* 안경 */
.year65_man .face .glasses,
.year65_woman .face .glasses{
	display:block;
	}			
.meal_configuration {
	position: relative;
	overflow: hidden;
	}

.meal_configuration .h2 {color:#252525;font-size:13px;margin:15px 0 10px;}
.meal_configuration .h2.first{margin-top:0;}	

.radio_btn{overflow:hidden;}
.radio_btn li{float:left;width:25%;text-align:center;}
.radio_btn li label{display:block;font-size:13px;font-weight:bold;border:1px solid #e3e4e8;padding:10px 0;cursor:pointer;margin-left:5px;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.radio_btn li label:hover{background-color:#f5f5f5;}
.radio_btn li:first-child label{margin-left:0;}
.radio_btn li input[type="radio"]{ position: absolute; visibility: hidden;}
.radio_btn li input[type="radio"]:checked+label{border:none;background-color:#786965;border:1px solid #786965;color:#fff;}

/*음식 검색*/
.food_search{border:4px solid #d6d2d0;background:#d6d2d0;margin:10px 0 16px;}
.food_search input[type="text"]{width:398px;border:0;border-radius:0;height:27px;vertical-align:top;padding-left:10px;}
.food_search .btn_search{width:45px;height:32px;font-size:0;background:#d6d2d0 url("../../images/rol/content/btn_search_icon.png") no-repeat center center;border-radius:0;padding:0;vertical-align:top;}
/*섭취한 음식 상세 선택 */
.food_detail_select h2 {
	padding: 10px 0;
	background-color:#f57f17;
	color:#fff;
	text-align:center;
	font-size:16px;
	font-weight:normal;
	}
.caloric_intake {
	height: 180px; 
	padding:18px;
	background-color:#fff3e0;
	border:1px solid #fce2c4;
	border-top: none;
	overflow: hidden; 
	}
.caloric_intake li {
	position:relative; 
	height: 24px; 
	margin-top: 6px; 
	overflow: hidden;
	}
.caloric_intake li:first-child {
	margin-top: 0;
	}
.caloric_intake li:after{
	display:block;
	position:absolute;
	top:12px;
	left:0;
	width:220px;
	border-top:2px dotted #cacec8;
	content:"";
	}
.caloric_intake li span{
	position:relative;
	padding-right:10px;
	background:#fff3e0;
	z-index:1;
	}	
.caloric_intake button{
	margin-left: 3px;
	padding: 1px 8px;
	background-color:#fff;
	border: 1px solid #dedfe0;
	border-right-color:#c9cacc;
	border-bottom-color:#c9cacc;
	color:#6c6d70;
	line-height: 1.3;
	font-size:15px;
	}
.caloric_intake button:hover{
	background-color: #f5f5f5;
	}

/* 내가 섭취한 음식 */
/* .myfood:before{content:"";display:block;width:43px;height:28px;background:url("../../images/rol/content/myfood_arrow.png") no-repeat 0 0;margin:12px auto;} */
.myfood {margin-top: 10px;}
.myfood h2{background-color:#69748a;color:#fff;font-size:14px;padding:10px 0;margin:0;padding-left:25px;}
.myfood ul{background-color:#f8f8f8;border:1px solid #ddd;border-top:0;}
.myfood>ul>li{border-top:1px solid #ddd;padding:10px 25px 10px 12px;overflow:hidden;}
.myfood>ul>li:first-child{border-top:none;}
.myfood a{font-size:12px;color:#6c6d70;}
.myfood strong{float:left;display:inline-block;padding-left:13px;}
.myfood li p{float:right;width:375px;}
.myfood .note{font-size:12px;color:#757577;margin-top:5px;}

.btn_area {overflow:hidden;}
.btn_replay,
.btn_result{background:#979ead;color:#fff;font-size:12px;padding:15px 25px;height:50px;border:1px solid #858d9f;vertical-align:middle;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.btn_replay:before{content:"";display:inline-block;vertical-align:middle;background:url("../../images/rol/content/btn_replay_icon.png") no-repeat 0 0;width:13px;height:16px;margin-right:7px;}
.btn_result{margin-left:-6px;}
.btn_replay:hover,
.btn_result:hover{background:#4d5971;}

/* 
 * 간단평가 
 */
.meal_configuration .type_select{background-color:#786965;padding:10px 20px;}
.meal_configuration .type_select h2{color:#fff;float:left;margin-right:13px;letter-spacing:-0.5px;}
.meal_configuration .type_select select{width:70px;border-radius:0;}

.food_simple_select tr {
	float: right; 
	display: block; 
	position: relative; 
	width: 378px;
	}
.food_simple_select thead tr th:nth-child(1),
.food_simple_select tbody th {
	position: absolute;
	margin-left: -90px;
	padding: 0;
	color:#fff;
	z-index: 10;
	}	
.food_simple_select thead tr th:nth-child(2){width:43%;}
.food_simple_select thead tr th:nth-child(3){width:15%;}
.food_simple_select thead tr th:nth-child(4){width:15%;}
.food_simple_select thead tr th {padding-left:0; padding-right:0; font-size:13px;letter-spacing:-0.5px;}

.food_simple_select tbody tr:after{display:block; clear:both; content:""; }
.food_simple_select tbody th {
	margin-top: -12px;
	}
	
.food_simple_select tbody th span {
	display: table-cell;
	width: 80px;
	border-radius: 5px;
	vertical-align: middle;
	}
.food_simple_select tbody td {
	display: block;
	float: left;
	height: 25px;
	padding: 3px 0 0;
	}
.food_simple_select tbody tr td:nth-of-type(1){width:58.2%; padding-left:10px; text-align:left;}
.food_simple_select tbody tr td:nth-of-type(2){width:19.04%; text-align:center; font-size:13px;}
.food_simple_select tbody tr td:nth-of-type(3){width:19.84%;}
.food_simple_select [class^="grain_"]{background-color:#fef3e7;}
.food_simple_select [class^="meat_"]{background-color:#efeaf4;}
.food_simple_select [class^="vegetables_"]{background-color:#e5f5ed;}
.food_simple_select [class^="dairy_"]{background-color:#e5f5ff;}
.food_simple_select [class$="_top"] {
	padding-top:11px;
	border-top:1px solid #dedfe0;
	border-left:1px solid #dedfe0;
	border-right:1px solid #c9cacc;
	border-radius:5px 5px 0 0;
	}
.food_simple_select [class$="_top"] td {
	padding-top:0;
	}
.food_simple_select [class$="_bottom"] {
	margin-bottom: 5px;
	padding-bottom: 11px;
	border-left: 1px solid #dedfe0; 
	border-right: 1px solid #c9cacc;
	border-bottom: 1px solid #c9cacc; 
	border-radius: 0 0 5px 5px;
	}
.food_simple_select .fruits {
	margin-bottom:5px;
	padding-top:11px;
	background-color:#fcebea;
	border-radius:5px;
	border:1px solid #dedfe0;
	border-right-color:#c9cacc;
	border-bottom-color:#c9cacc;
	}
.food_simple_select .dish {
	background-color:#f0f2f5;
	border-radius:5px;
	border:1px solid #dedfe0;
	border-right-color:#c9cacc;
	border-bottom-color:#c9cacc;
	}	
.food_simple_select tbody .dish th {
	margin-top: -1px;
	}	
.grain_top th span {height:77px; background-color:#f58718;}
.meat_top th span {height:133px; background-color:#662d91;}
.meat_middle {border-left:1px solid #dedfe0; border-right:1px solid #c9cacc;}
.vegetables_top th span{height:77px; background-color:#00a04a;}
.dairy_top th span{height:77px; background-color:#009afd;}
.fruits th span{height: 49px; background-color:#e43934;}
.dish th span{height:48px; background-color:#fff; box-shadow:inset 0px 0px 0px 1px #c9cacc; color:#6c6d70;}

.food_simple_select tbody .fruits td{height:36px;padding-top:0;}
.food_simple_select tbody .dish td{height:34px;padding-top:12px;}
.food_simple_select button{font-size:13px;color:#555;border:1px solid #dedfe0;border-right-color:#c9cacc;border-bottom-color:#c9cacc;background-color:#fff;padding:0px 5px 2px;}
.food_simple_select button:hover{background-color:#f5f5f5;}
.food_simple_select .dot_lstyle{margin-top:10px;font-size:12px;color:#757577;}

/* 
 * 음식구분표
 */
.food_table thead tr th{font-size:12px;padding-top:10px;padding-bottom:10px;}
.food_table	tbody th {
	margin-left: -109px;
	}
.food_table tbody tr td:nth-of-type(1){font-size:13px;}
.food_table tr{width:620px;}
.food_table tbody th span{width:100px;}
.food_table [class^="grain_"],
.food_table [class^="meat_"],
.food_table [class^="vegetables_"],
.food_table [class^="dairy_"],
.food_table .fruits,
.food_table .dish{background-color:#fff;}
.food_table .grain_top span,
.food_table .vegetables_top span,
.food_table .dairy_top span{height:71px;}
.food_table .meat_top span{height:121px;}
.food_table .fruits span{height:49px;}
.food_table tbody td img:first-child{margin-left:40px;}

.food_table .legend img{width:13px;height:13px;vertical-align:middle;}
.food_table .legend li{padding-left:0;background:none;}
.food_table .arrow_lstyle{font-size:12px;margin-top:20px;}
.food_select_sample{margin-top:40px;background-color:#f8f8f8;}
.food_select_sample h2.title{background-color:#69748a;color:#d1d5dc;font-size:18px;text-align:center;padding:14px 0;}
.food_select_sample h2.title span{color:#fff;}
.food_select_sample h2.title span:before{content:"";display:inline-block;width:47px;height:47px;vertical-align:middle;margin-right:15px;background:url("../../images/rol/content/food_select_sample_icon.png") no-repeat 0 0; }
.food_select_sample>div{overflow:hidden;position:relative;background: no-repeat 98% bottom;}
.food_select_sample .soup{background-image:url("../../images/rol/content/food_table_spoon.jpg");}
.food_select_sample .dish{background-image:url("../../images/rol/content/food_table_stick.jpg");}
.food_select_sample strong.title{
	float:left;width:120px;height:104px;
	color:#fff;text-align:center;
	padding-top:26px;margin-right:30px;
	position:relative;
	}
.food_select_sample strong.title:after{
	content:"";width:0;height:0;
	border:10px solid transparent;border-width:8px 10px;border-right-color:#f8f8f8;
	position:absolute;right:0;top:30px;
	}
.food_select_sample .soup .title{background-color:#868ea0;}
.food_select_sample .dish .title{background-color:#a2a9b6;}
.food_select_sample .question_select{height:130px;border-bottom:1px solid #ddd;border-right:1px solid #ddd;padding:22px;box-sizing:border-box;}
.food_select_sample .question_select strong{display:block;margin-bottom:5px;}
.food_select_sample .question_select strong:before{content:"Q";display:inline-block;vertical-align:middle;margin:0 5px 5px 0;color:#d9394a;font-size:18px;}
.food_select_sample .question_select button{
	background:#fff;
	border:1px solid #c9cacc;border-top-color:#dedfe0;border-left-color:#dedfe0;
	padding:8px 15px 10px;margin-left:3px;border-radius:3px;
	font-size:15px;color:#69748a;
	-webkit-transition:background 0.3s ease;transition:background 0.3s ease;
	}
.food_select_sample .question_select button:hover{background-color:#f5f5f5;transform:translate(-1px,-1px);border-bottom-width:2px;}	
.food_select_sample .question_select button:first-of-type{margin-left:0;}
.food_select_sample .replay_btn{
	position:absolute;left:20px;bottom:30px;
	width:80px;height:40px;	
	background-color:rgba(34,50,83,0.1);border:1px solid rgba(34,50,83,0.2);
	font-size:12px;color:#fff;
	-webkit-transition:all 0.3s ease;transition:all 0.3s ease;
	}
.food_select_sample .replay_btn:hover{
	background-color:rgba(34,50,83,0.3);border:1px solid rgba(34,50,83,0.4);
	}	

/* 
 * 결과페이지
 */
.calorie_state .title{text-align:center;color:#252525;margin-bottom:30px;}
.calorie_state .name{font-size:25px;font-weight:normal;display:block;}
.calorie_state .date{font-size:16px;}
.calorie_state .graph{width:310px;height:16px;background-color:#ebeff6;border-radius:8px;box-shadow:inset 1px 1px rgba(0,0,0,0.07);position:relative;margin:0 auto 78px;}
.calorie_state .graph .bar{display:block;height:100%;background-color:#d9394a;border-radius:8px;}
.calorie_state .graph .percent{position:absolute;top:20px;left:20px;color:#252525;}
.calorie_state .graph .percent strong{font-size:20px;}
.calorie_state .graph .calorie{position:absolute;top:20px;right:20px;font-size:20px;color:#d9394a;}
.food_type_state {margin: auto;}
.food_type_state li{background-color:#fafafb;border:1px solid #e4e7ec;display:inline-block;width:88px;height:145px;vertical-align:top;text-align:center;}
.food_type_state .food{display:block;font-size:14px;color:#2f3743;height:36px;margin:18px 0 0 0;line-height:1.4;letter-spacing:-0.5px;}
.food_type_state .state{display:block;width:58px;height:58px;line-height:58px;margin:15px auto 0;text-align:center;color:#fff;background:url("../../images/rol/content/food_type_state.png") no-repeat 0 0;}
.food_type_state .state.lack{background-position: -58px 0;}
.food_type_state .state.over{background-position: -116px 0;}
.meal_configuration .depth2_title02{font-size:16px;}
.note.box{background-color:#fafafb;border:1px solid #e9eaee;padding:10px 15px;margin-top:30px;}