#surveyScene {
background-color: #00afef;
display: none; }
#surveyScene .title {
color: #fff; }
#surveyScene .body {
position: relative;
background-color: #00afef;
width: 100%;
height: 100%;
overflow: auto; }

/*

フォント確認用です。
font-family:'DIN Next W01';

LIGHT   : 200
REGULAR : 400
MEDIUM  : 500
BOLD    : 700
HEAVY   : 800

*/

/* #surveyScene {font-family:'DIN Next W01',"YuGothic", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;} */
#surveyScene a{text-decoration: none;}
#surveyScene .block {display: table; position: relative; color: #00afef; background-color: #fff; width: 50%; height: 450px; float: left; font-size: 12px; }
#surveyScene .cell { height: 100%; display: table-cell; vertical-align: middle;}
#surveyScene .animate_result { background: #fff; color: #00afef; }
#surveyScene .animate_body {background: #00afef;}
#surveyScene .animate_body { color: #fff;}
#surveyScene .animate_body h2 { font-weight: 300; text-align: center; letter-spacing: 1px; font-size: 18px; width: 100%; position: absolute; left: 0; bottom: 50px;}
#surveyScene .pattern{position: absolute; left: -9999px; top: 0; z-index: -9999;}
.animate_section{display: block;}

/* CHART */
.chart_wrap {width: 250px; height: 250px; margin: 0 auto; }

/* RESULT */
.result_header{padding: 0 20px;}
.result_header .result_title{text-align: center; font-weight: bold; font-size: 20px;letter-spacing: 0px; padding: 0 0 20px 0;}
.result_header .result_title.short{letter-spacing: 5px;}
.result_header p{font-size: 13px; font-weight: bold; padding:0 0 30px 0; line-height: 18px; width: 284px; margin: 0 auto;}
.survey_box hr { border: none; background: #00afef; height: 1px; width: 100%; margin-top: 10px;}
.result_hr{display: table;}
.result_hr span { height: 1px; width: 100%; display: block; background: #00afef; }
.result_hr .td { width: 50%; display: table-cell; vertical-align: middle;}
.result_hr .td img { vertical-align: bottom; }
.result_hr .td.result_hr_txt { width: 74px; }
.result_body { width: 390px; margin: 0 auto; }
.result_inner {width: 324px; margin: 0 auto;}
.result_list {padding:30px 20px;}
.result_list > li { padding-top: 10px; }
.result_list > li:first-child { padding-top: 0px; }
.result_txt { font-weight: 500; font-size: 12px; padding-left: 1em; }
.result_list_LR .result_txt { padding-left: 0;}
.result_pict { width: 19px; }
.result_para { width: 100%; display: table;}
.result_para .td {display: table-cell; vertical-align: bottom; }
.result_para .td img, .result_para .td { vertical-align: bottom; }
.result_list_R .result_para .td{overflow:hidden;}
.result_list_R .result_para .td.result_txt {width: 55px;}
.result_list_R .result_para .td.result_num {width: 75px; text-align: right}
.result_txt { font-weight: bold; font-size: 11px; line-height: 16px;}
.result_list_short .result_txt {font-size: 13px; font-weight: 500;}
.result_num { text-align: right; }
.result_num span { display: inline-block; }
.result_num ._num { font-weight: 500; font-size: 21px; line-height: 21px; }
.result_num ._unit { font-weight: 500; font-size: 12px; }
.result_sizeL .result_num {text-align: right;}
.result_sizeL .result_num ._num { font-weight: 500; font-size: 36px; }
.result_sizeL .result_num ._unit { font-weight: 500; font-size: 18px; }
.result_score {text-align: center; font-size: 0; padding:0px 0 20px 0;}
.result_score span　{display:inline-block;vertical-align: bottom; line-height: 1;}
.result_score .jp    {font-weight: bold; font-size: 18px; padding: 0 5px;}
.result_score ._num  {font-weight: 500; font-size: 42px;}
.result_score .slash {font-weight: 300; font-size: 20px;}
.result_score ._max  {font-weight: 500; font-size: 11px; letter-spacing: 0;}
.result_list_LR {display: table; padding: 20px; width: 100%; border-bottom: 1px solid #00afef}
.result_list_LR h3 {margin: 3px 0 0px 0; font-size: 13px; height: 46px; }
.result_list_LR > .td{width: 110px; vertical-align: top; float: left;}
.result_list_LR > .td.result_list_line{width: 30px;}
.result_list_LR > .td.result_list_L{width: 140px; overflow: hidden;}
.result_list_LR .result_score{padding: 0; text-align: left;}
.result_list_LR .result_score .jp{font-size: 13px;}
.result_list_LR .result_score .jp:first-child{padding: 0 5px 0 0;}
.result_list_LR .result_score ._num{font-size: 36px;}
.result_list_LR .result_list{padding: 0;}
.result_list_B {clear: both; text-align: center; font-weight: bold; font-size: 14px; margin-top:20px;}
.show_features { display: block; color: #00afef; position: relative; height: 48px; padding: 6px; border: 1px solid #00afef; border-radius: 48px; }
.show_features span { display: block; padding: 0 0 0 20px; }
.show_features img { position: absolute; right: 5px; top: 5px; }
.show_features span.en { font-size: 20px; font-weight: 100; padding-top:1px;}
.show_features span.jp { font-size: 11px; padding-top: 3px; }

/* ANIMATE BODY */
.animate_title { line-height: 1; position: absolute; width: 64px; top: 50%; left: 50%; margin: -26px 0 0 -32px; }
.animate_title.animate_title_par{width: 74px; margin: -20px 0 0 -37px;}
.animate_title ._average ._num { font-size: 36px; font-weight: 400; letter-spacing: -1px; }
.animate_title ._title {margin-bottom: 4px;}
.animate_title ._average ._unit{font-weight: 300; padding: 0 0 0 3px;}
.animate_body .arrows {position: absolute; top: 50%; margin-top: -20px; z-index: 10; transition:all 0.3s;}
.animate_body .arrows{left:0;}
.even .animate_body .arrows{right:0; left:auto; }
.enter .animate_body .arrows{left:-19px;}
.even.enter .animate_body .arrows{right:-19px; left:auto;}
.animate_body h2{text-align: center;}
.animate_body h2 span {display: inline-block; background-repeat: no-repeat; background-position: left center; padding: 10px 0 5px 35px; }
.animate_section_1 .animate_body h2 span{background-image:url(../images/icon_result_1@1x.png);}
.animate_section_2 .animate_body h2 span{background-image:url(../images/icon_result_2@1x.png);}
.animate_section_3 .animate_body h2 span{background-image:url(../images/icon_result_3@1x.png);}
.animate_section_4 .animate_body h2 span{background-image:url(../images/icon_result_4@1x.png);}
.animate_section_5 .animate_body h2 span{background-image:url(../images/icon_result_5@1x.png);}
.animate_section_6 .animate_body h2 span{background-image:url(../images/icon_result_6@1x.png);}
.animate_section_7 .animate_body h2 span{background-image:url(../images/icon_result_7@1x.png);}
.animate_section_8 .animate_body h2 span{background-image:url(../images/icon_result_8@1x.png);}

/* ADVISER */
.animate_section_0 { background: #f2f2f2; }
.adviser { text-align: center; display: table; width: 100%; height: 100%; }
.adviser div { display: table-cell; vertical-align: middle; }
.adviser h2 { font-size: 16px; color: #00afef; line-height: 1.5; }
.adviser p { color: #9a9a9a; font-size: 12px; line-height: 1.5; }
.adviser strong { font-size: 14px; font-weight: normal; display: block; }
.adviser h1, .adviser h2, .adviser p { margin-bottom: 25px; }

/* FEAUTURES */
.animate_section { display: block; height: 450px; overflow: hidden; clear: both; -moz-perspective: 1000px; -webkit-perspective: 1000; -o-perspective: 1000; -ms-perspective: 1000; }
#surveyScene .features { display: table; position: absolute; top: 0; left: 0; width: 100%; height: 450px; background: #fff; z-index: -9999; opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; transition: all 0.3s; -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); -webkit-transform-origin: center right; transform-origin: center right; transition: -webkit-transform 0.5s, opacity 0.5s, z-index 0s 0.5s; transition: transform 0.5s, opacity 0.5s, z-index 0s 0.5s; }
#surveyScene .even .features { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); -webkit-transform-origin: center left; transform-origin: center left; }
#surveyScene .open .features { z-index: 11; opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; transition: -webkit-transform 0.5s, opacity 0.5s, z-index 0s; transition: transform 0.5s, opacity 0.5s, z-index 0s; -webkit-transform: rotateY(0deg); transform: rotateY(0deg); }
.features_body { width: 350px; margin: 0 auto; }
.close_features { display: block; position: absolute; right: -20px; top: 50%; margin-top: -20px; transition: all 0.5s; opacity: 0; }
.close_features { opacity: 1; }
.even .close_features { left: -20px; }
.features_header { margin-bottom: 30px; }
.features_header span { display: block; }
.features_header .en { font-size: 32px; font-weight: 300; margin-bottom: 5px; }
.features_body p:first-child { margin: 0; }
.features_body p { letter-spacing: 0; line-height: 1.8; margin-top: 1em; }
.features_body p.min{font-size: 11px;}
.features_links { margin-top: 30px; border: 1px solid #00afef; border-radius: 45px; width: 237px; line-height: 48px; display: block; text-align: center; color: #00afef; font-weight: bold; }
.features_links span { display: inline-block; }
.features_links img { margin-top: -2px; }
.features_links span:first-child { padding: 0; }
.features_links span { padding: 0 0 0 5px; }

/* TOOLTIPS */
.tooltip{position: absolute;top: 50%;left:50%;}
.tooltip_body { position: relative; height: 16px; line-height: 16px; width: 44px; text-align: center; font-size: 0; }
.tooltip_body span {display: inline-block; font-weight: 400; letter-spacing: 0;}
.tooltip_body ._num { font-size: 15px; }
.tooltip_body ._unit { font-size: 9px; }
.tooltip_bar { position: absolute; display: block; background: #fff; }
.tooltip_bottom .tooltip_bar { width: 1px; height: 12px; bottom: -12px; left: 50%; }
.tooltip_top .tooltip_bar { width: 1px; height: 12px; top: -12px; left: 50%; }
.tooltip_left .tooltip_bar { height: 1px; width: 12px; left: -12px; top: 50%; }
.tooltip_right .tooltip_bar { height: 1px; width: 12px; right: -12px; top: 50%; }

/* LAYOUT */
.survey_box .animate_section_1 .tooltip_0 { margin: -8px 0 0 140px; }
.survey_box .animate_section_1 .tooltip_1 { margin: 64px 0 0 -160px; }
.survey_box .animate_section_1 .tooltip_2 { margin: -135px 0 0 -90px; }
.survey_box .animate_section_3 .tooltip_0 { margin: -134px 0 0 50px; }
.survey_box .animate_section_3 .tooltip_1 { margin: 64px 0 0 116px; }
.survey_box .animate_section_3 .tooltip_2 { margin: -9px 0 0 -183px; }
.survey_box .animate_section_3 .tooltip_3 { margin: -134px 0 0 -95px; }
.survey_box .animate_section_6 .tooltip_0 { margin: -134px 0 0 50px; }
.survey_box .animate_section_6 .tooltip_1 { margin: 64px 0 0 116px; }
.survey_box .animate_section_6 .tooltip_2 { margin: -4px 0 0 -183px; }
.survey_box .animate_section_6 .tooltip_3 { margin: -134px 0 0 -95px; }
.bar_wrap{display: none;}
.transition .bar_wrap{display: block;}


/* BAR */
.bg_slash { background: url(../images/bg_survey_slash_1.jpg); border-right: 1px solid #00afef; border-left: 1px solid #00afef; }
.bg_blue { background: #22c9ef; border-right: 1px solid #00afef; border-left: 1px solid #00afef; }
.bg_dotted { background: url(../images/bg_survey_dotted.jpg); border-right: 1px solid #00afef; border-left: 1px solid #00afef; }
.bg_white { background: #fff; border-right: 1px solid #00afef; border-left: 1px solid #00afef; }
.bar_wrap .bar.bg_none { background: none; border-right: 1px solid #00afef; border-left: 1px solid #00afef; }
.bar_wrap .bg_none .border { height: 100%; width: 100%; border: 2px solid #fff; }
.bar_wrap { position: relative; width: 290px; margin: 0 auto; height: 150px; }
.bar_wrap .animate_title { top: -65px; left: auto; right: 0; margin: 0; }
.bar_wrap p { margin: 5px 0 0 1px; }
.bar_body { height: 100%; width: 100%; }
.bar { opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; position: relative; height: 100%; float: right; }
.bar_inner{position: relative; height: 100%; width: 100%;}
.bar_wrap1 { margin-bottom: 60px; }
.bar_wrap1, .bar_wrap2 { height: 80px; }
.bar .tooltip { top: -33px; left: 50%; width: 44px; margin: 0 0 0 -22px; }
.bar .tooltip.tooltip_top { top: auto; bottom: -33px; left: 50%; width: 44px; margin: 0 0 0 -22px; }
.bar .tooltip.tooltip_left { top: 50%; left: auto; width: 44px; margin: -8px 0 0 0; right: -60px; }
.bar .tooltip.tooltip_right { top: 50%; left: -60px; width: 44px; margin: -8px 0 0 0; }
.bar_vertical_wrap.bar_wrap { width: 150px; height: 240px; }
.bar_vertical_wrap .bar { height: 100%; width: 100%; float: none; }
.bar_vertical_wrap.bar_wrap .bar.bg_none, .bar_vertical_wrap .bg_slash, .bar_vertical_wrap .bg_blue, .bar_vertical_wrap .bg_dotted, .bar_vertical_wrap .bg_white { border: none; border-top: 1px solid #00afef; border-bottom: 1px solid #00afef; }
.bar_vertical_wrap.bar_wrap .animate_title {top: -40px; left: 0; right: auto; margin: 0; display: table; }
.bar_vertical_wrap.bar_wrap .animate_title > div{display:table-cell; vertical-align: top;}
.bar_vertical_wrap.bar_wrap .animate_title > div._title{padding-right:10px;}
.bar_horizontal_wrap.bar_wrap .animate_title{top: -80px; left: 50%; right: auto; margin: 0 0 0 -75px; width: 150px;}
.bar_horizontal_wrap.bar_wrap .animate_title > div{display:table-cell; vertical-align: top;}
.bar_horizontal_wrap.bar_wrap .animate_title > div._title{padding-right:10px;}
.bar_wrap .animate_title > div._title{padding-top:1px;}
.major {position: relative; height: 100%; width: 3px;}
.major_ol{position: absolute; top: 0; left:-15px; font-size: 11px; height: 100%; width: 7px; border-left:1px solid #99dff9; border-bottom:1px solid #99dff9;}
.major_ol span{display: block; width: 100%; border-top:1px solid #99dff9;}
.major_ol span.m{height: 10%;}
.major_ol span.m1,.major_ol span.m6{width: 6px;}
.major_ol span.major_num{position: absolute; left:-45px; width: 40px; text-align:right; border:none;}
.major_num1{top: 0;}
.major_num2{top: 50%; margin-top: -5px;}
.major_num3{bottom: -2px;}
.bar_horizontal_wrap .major_ol{height:7px; width:100%; left:0; top: -15px; border-bottom: none; border-top:1px solid #99dff9; border-right:1px solid #99dff9; }
.bar_horizontal_wrap .major{width: 100%; height: 7px;}
.bar_horizontal_wrap .major_ol span.m{width: 10%; height: 4px;}
.bar_horizontal_wrap .major_ol span.m10{display:none;}
.bar_horizontal_wrap .major_ol span.m1,.bar_horizontal_wrap .major_ol span.m6{height: 6px;}
.bar_horizontal_wrap .major_ol span{border-top: none; border-right: 1px solid #99dff9;float: left;}
.bar_horizontal_wrap .major_ol span.major_num{position: absolute; left:0; top:-13px; width: auto; text-align:left; border:none;}
.bar_horizontal_wrap .major_ol span.major_num3{top: -13px; left:0;}
.bar_horizontal_wrap .major_ol span.major_num2{top: -13px;margin-top: 0px; left:50%; margin-left: -40px; width: 80px; text-align: center;}
.bar_horizontal_wrap .major_ol span.major_num1{top: -13px;bottom: auto; right: 0; left:auto;}


/* SATISFACTION */
.survey_footer { padding: 30px; background: url(../images/bg_survey_slash_2.jpg); clear: both;}
.survey_footer .inner { background: #00afef; padding: 30px 0; }
.survey_footer .inner > h1 { font-size: 24px; text-align: center; font-weight: 300; line-height: 1; padding: 0 0 30px 0; }
.survey_footer .inner > h2 {font-size: 14px; text-align: center; margin-bottom: 30px; letter-spacing: 1px;}
.survey_footer { color: #fff; width: 100%; }
.survey_footer_body { display: table; width: 100%; }
.survey_footer_body > .td { display: table-cell; padding: 20px 0; width: 50%;}
.survey_footer_body > .td.survey_footer_center{width: 2px;}
.survey_footer_body > .td.survey_footer_center{width: 0px; background: none;}
.survey_footer_body{background: url(../images/bg_airport_dotted.jpg) center repeat-y;}
.animate_section_10 .survey_footer_body{background:none;}
.animate_section_10 .survey_footer_left{border-right:1px solid #00afef;}
.satisfaction_title { text-align: center; font-size: 20px; text-align: center; }
.survey_footer_body .result_hr span { background: #fff; }
.satisfaction_average { margin: 3px 0 40px 0; position: relative;}
.satisfaction_txt{font-size:16px; font-weight: bold; padding-left: 10px;padding-bottom: 10px;}
.survey_footer_right .satisfaction_txt {letter-spacing: 0;text-indent: -0.5em; }
.survey_footer .satisfaction_sub{font-size: 11px; display: block; height: 40px; line-height: 40px; text-align: center;}
.survey_footer .result_body {width: 324px;}
.airport { display: block; position: relative; width: 100%; height: 104px; }
.airport .dotted { position: absolute; right: 92px; bottom: 20px; }
.airport .point { position: absolute; right: 10px; bottom: 20px; }
.airport_body { width: 100%; }
.airport_body .flip_body { border-radius: 5px; position: absolute; font-size: 80px; width: 66px; text-align: center; vertical-align: bottom; border: 2px solid #fff; padding: 16px 0 0px 0; height: 104px; bottom:0; background: url(../images/bg_airport.jpg) center center; font-weight: 500; }
.airport_body .flip_body:after { content: ''; position: absolute; display: block; width: 64px; height: 2px; z-index: 2; background: #00afef; left: -2px; top: 50%; margin: -2px 0 0 0; }
.airport_body .c3:after { width: 44px; }
.airport_body .c0 { left: 10px; }
.airport_body .c1 { left: 79px; }
.airport_body .c2 { left: 148px; }
.airport_body .c3 { font-size: 48px; width: 44px; height: 77px; bottom: 0; left: 243px; }
.airport_body .flip_relative { position: relative; -moz-perspective: 500px; -webkit-perspective: 500; -o-perspective: 500; -ms-perspective: 500; width: 62px; height: 200px; overflow: hidden; }
.airport_body .c3 .flip_relative { width: 40px; }
.airport_body .flip_relative .flip_inner { text-align: center; position: absolute; top: 0; left: 0; width: 100%; transition: -webkit-transform 0.15s, opacity 0.05s; transition: transform 0.15s, opacity 0.05s; }
.airport_body .flip_relative .flip_2 { top: 34px; }
.airport_body .flip_relative .flip_4 { top: 34px; }
.airport_body .flip_relative .flip_2 span { top: -34px; }
.airport_body .flip_relative .flip_4 span { top: -34px; }
.airport_body .c3 .flip_relative .flip_2 { top: 22px; }
.airport_body .c3 .flip_relative .flip_4 { top: 22px; }
.airport_body .c3 .flip_relative .flip_2 span { top: -22px; }
.airport_body .c3 .flip_relative .flip_4 span { top: -22px; }
.airport_body .flip_relative .flip_1 { z-index: 1; background: url(../images/bg_airport_top.jpg); }
.airport_body .flip_relative .flip_2 { z-index: 2; background: url(../images/bg_airport_bottom.jpg); }
.airport_body .flip_relative .flip_3 { z-index: 2; background: url(../images/bg_airport_top.jpg); }
.airport_body .flip_relative .flip_4 { z-index: 1; background: url(../images/bg_airport_bottom.jpg); }
.airport_body .flip_relative .flip_3 { -webkit-transform: rotateX(0deg); transform: rotateX(0deg); -webkit-transform-origin: center bottom; transform-origin: center bottom; }
.airport_body .leave .flip_relative .flip_3 { -webkit-transform: rotateX(180deg); transform: rotateX(180deg); opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; }
.airport_body .flip_relative .flip_2 { -webkit-transform: rotateX(180deg); transform: rotateX(180deg); -webkit-transform-origin: center top; transform-origin: center top; opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; }
.airport_body .leave .flip_relative .flip_2 { z-index: 3; -webkit-transform: rotateX(0deg); transform: rotateX(0deg); opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; }
.airport_body .flip_relative .flip { position: relative; overflow: hidden; width: 100%; height: 32px; }
.airport_body .c3 .flip_relative .flip { height: 20px; }
.airport_body .flip_relative span { display: block; position: absolute; top: 0; left: 0; width: 100%; }
.airport_score { clear: left; }
.survey_footer_center { background: url(../images/bg_airport_dotted.jpg) center repeat-y; }
.survey_footer_right .result_para .td { vertical-align: middle; }
.survey_footer_body .result_txt { padding: 0; }
.animate_section_10 .survey_footer_body > .td { vertical-align: top; }
.animate_section_10 .survey_footer .inner { padding: 30px 0 0 0; }
.animate_section_10 .survey_footer { color: #00afef; background: #f2f2f2; padding: 30px; }
.animate_section_10 .survey_footer .inner { background: #f2f2f2; }
.animate_section_10 .survey_footer_center { width: 1px; background: #00afef; }
.animate_section_10 .result_body { width: 100%; padding: 0 64px; margin: 0 auto; }
.shutter li { font-size: 12px; line-height: 1.5; text-align: justify; padding-top: 20px; margin-top: 20px; border-top: 1px solid #00afef; position: relative; }
.shutter li .hide { visibility: hidden; }
.shutter li .shuttered_ol { position: absolute; width: 0; opacity: 0; height: 100%; overflow: hidden; transition: all 0.5s ease-out; }
.notransition .shutter li .shuttered_ol { opacity: 1; width: 100%; height: 100%; }
.shutter li .shuttered { position: relative; width: 100%; height: 100%; }
.shutter li .shuttered span { position: absolute; display: inline-block; }
.shutter .on .shuttered_ol { opacity: 1; width: 100%; }
.shutter li:first-child { padding-top: 0; margin-top: 0; border-top: none; }
.survey_footer .addvoice li:first-child {padding-top: 20px; border-top: 1px solid #00afef; }
.survey_footer_bottom { margin: 30px 64px 40px 64px; position: relative; height: 64px; display: block; }
.survey_footer_bottom div { padding: 10px 0; border: 1px solid #00afef; display: block; text-align: center; width: 100%; position: absolute; top: 0; left: 0; transition: all 0.3s; }
.close_morevoice {  opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; }
.show_morevoice { opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; }
.on .close_morevoice {  opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; }
.on .show_morevoice {  opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; }
.survey_footer_bottom div span { display: block; font-size: 11px; color: #00afef; }
.survey_footer_bottom div span:first-child { margin-bottom: 5px; }
.addvoice { display: none; }

/* LINE CHART */
.line_ol { position: relative; width: 0; height: 230px; opacity: 0; border-left: 2px solid #fff; border-bottom: 2px solid #fff; }
.line_body { position: absolute; left: 0; bottom: 0; }
.line_body svg, .line_body { width: 270px; height: 230px; }
.line_dotted { height: 8px; width: 8px; display: block; border-radius: 8px; background: #fff; position: absolute; margin: -4px 0 0 -4px; z-index: 3; }
.line_offset { z-index: 2; width: 1px; position: absolute; background: #94def2; display: block; }
.line_title {position: absolute; text-align: center; font-size: 16px; font-weight: bold; line-height: 23px; width: 100%; top: 65px; }
#surveyScene .animate_section_2 .animate_body h2 {bottom: 40px;}
#line1 .line { stroke: #fff; stroke-dasharray: 4px; stroke-width: 2; }
#line1 .fill { fill: url(#line_trans);}
#line2 .line { stroke: #fff; stroke-width: 2; }
.line_wrap { width: 270px; margin:0 auto; position: relative; }
.line_wrap .xy { position: absolute; bottom: -21px; left: -23px; }
.line_wrap ._num { position: absolute; }
.line_wrap ._num div { position: relative; }
.line_wrap ._num span { display: block; background: #fff; position: absolute; }
.line_wrap ._num.x span { height: 2px; width: 6px; right: -10px; top: 4px; }
.line_wrap ._num.y span { height: 6px; width: 2px; left: 6px; top: -10px; }
.line_wrap ._num.x { left: -25px; }
.line_wrap ._num.y { bottom: -21px; }
.line_wrap ._num.x1 { top: -4px; }
.line_wrap ._num.x2 { top: 115px; }
.line_wrap ._num.y1 { left: 50px; }
.line_wrap ._num.y2 { left: 105px; }
.line_wrap ._num.y3 { left: 160px; }
.line_wrap ._num.y4 { left: 215px; }
.line_wrap ._num.y5 { left: 272px; }

/* IE8 */
.no-canvas .airport .dotted,
.no-canvas .flip_body,
.no-canvas .chart_wrap .animate_title{display: none !important;}
.no-canvas .animate_section_1 .chart_wrap{background: url(../images/img_chart_1.png) center center no-repeat;}
.no-canvas .animate_section_2 .line_ol   {background: url(../images/img_line_1.png) bottom left no-repeat;}
.no-canvas .animate_section_3 .chart_wrap{background: url(../images/img_chart_2.png) center center no-repeat;}
.no-canvas .animate_section_6 .chart_wrap{background: url(../images/img_chart_3.png) center center no-repeat;}
.no-canvas .survey_footer_left .airport{background: url(../images/img_score_1.png) 10px center no-repeat;}
.no-canvas .survey_footer_right .airport{background: url(../images/img_score_2.png) 10px center no-repeat;}

/* CSS ANIME START */
.animate_title ._title{ opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; transform: translate(0, 40px); }
.animate_title ._average{ opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; transform: translate(0, 20px); }
.tooltip { opacity: 0; filter: alpha(opacity=0); -ms-filter: "alpha(opacity=0)"; transform: translate(0, 20px); }
.line_wrap ._num{opacity: 0; transform: translate(0, 20px);}

/* CSS ANIME TIME */
.animate_title ._title { transition: all 0.4s; }
.bar_wrap .tooltip,.animate_title ._average { transition: all 0.4s 0.1s; }
.line_wrap ._num,.tooltip {transition: all 0.4s 0.3s; }

/* CSS ANIME END */
.go .animate_title ._title, .go .animate_title ._average{ opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; transform: translate(0, 0); }
.gogo .animate_title ._title, .gogo .animate_title ._average,.gogo .tooltip { opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; transform: translate(0, 0); }
.enter .line_wrap ._num{opacity: 1; filter: alpha(opacity=100); -ms-filter: "alpha(opacity=100)"; transform: translate(0, 0);}

/* RETINA */
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
.animate_body h2 span{background-size:24px;}
.animate_section_1 .animate_body h2 span{background-image:url(../images/icon_result_1@2x.png);}
.animate_section_2 .animate_body h2 span{background-image:url(../images/icon_result_2@2x.png);}
.animate_section_3 .animate_body h2 span{background-image:url(../images/icon_result_3@2x.png);}
.animate_section_4 .animate_body h2 span{background-image:url(../images/icon_result_4@2x.png);}
.animate_section_5 .animate_body h2 span{background-image:url(../images/icon_result_5@2x.png);}
.animate_section_6 .animate_body h2 span{background-image:url(../images/icon_result_6@2x.png);}
.animate_section_7 .animate_body h2 span{background-image:url(../images/icon_result_7@2x.png);}
.animate_section_8 .animate_body h2 span{background-image:url(../images/icon_result_8@2x.png);}
}