@charset "utf-8";

#contents .num{font-family: 'Cabin', sans-serif;}
/* body{font-family:"メイリオ", Meiryo,"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",sans-serif;} */
#contents{min-width:980px; color:#fff; -webkit-text-size-adjust: 100%;  background:#1976d2 url(/jp/contents/research/graphic/006/bg.png) repeat-y center;}
#contents .section .inner{width:980px; margin:0 auto; position:relative; clear:both;}
#contents .section .inner:after{content:''; display:block; clear:both;}
#contents .section h2,
#contents .section h3{margin-bottom:30px; opacity:1;}

#contents .section h2 img,
#contents .section h3 img{width:auto; height:auto;}

#contents .item{opacity:0; transition:all .5s ease-in; top:50px;}
#contents .item.play{opacity:1; top:0;}
#contents div.copy{border:1px #66ade7 solid; border-radius:20px; padding:20px 20px 20px 120px; width:780px; margin:0 auto; text-align:left; background:url(/jp/contents/research/graphic/006/octpus.png) no-repeat 20px center;} 
#contents div.copy p{display:block; font-size:14px;}
#contents .fig{width:980px; margin:0 auto; position:relative;}
#contents .fig img{position:absolute; left:0; z-index:1;}
#contents .fig img.placeholder{position:relative; left:auto; top:auto; z-index:0;}

#contents .sec00{background:#1e88e5 url(/jp/contents/research/graphic/006/sec00_bg.png) repeat-x center bottom; padding-top:30px;}
#contents .sec00 .inner{background:url(/jp/contents/research/graphic/006/sec00_bg02.png) no-repeat center center;}
#contents .sec00 .inner .item{top:0;}
#contents div.bottom{padding:30px 0; padding-bottom:50px;}
#contents div.bottom div.copy{background-image:none; padding:20px;}

#contents .sec01{padding:50px 0;}
#contents .sec01 .fig{overflow:hidden;}
#contents .sec01 .item.item01{opacity:1;}
#contents .sec01 .item.item04{opacity:1; left:-100px; transition:all .8s ease-in;}
#contents .sec01 .item.item05{opacity:1; left:auto; right:-400px; transition:all 1.2s ease-in;}
#contents .sec01 .item.item04.play{left:0;}
#contents .sec01 .item.item05.play{right:0;}

#contents .sec02{padding:30px 0;}
#contents .sec03{padding:30px 0;}
#contents .sec03 div.copy{margin:50px auto 0;}

#contents .sec04{background:url(/jp/contents/research/graphic/006/bg2.png) repeat-x left top, url(/jp/contents/research/graphic/006/bg.png) repeat-y center center #e0f7fa; padding:100px 0 50px;}
#contents .sec04 .pie{position:absolute; left:0; top:0; width:100%; height:100%;}
#contents .sec04 .pie .graph{width:37%; height:51.8%; position:absolute;}
#contents .sec04 .pie .graph.graph01{left:6.3%; top:15.4%;}
#contents .sec04 .pie .graph.graph02{left:57.14%; top:32%;}
#contents .sec04 .pie .graph:after{width:100%; height:100%; position:absolute; left:0; top:0; z-index:10; content:'';}
#contents .sec04 .pie .graph.graph01:after{background:url(/jp/contents/research/graphic/006/sec04_item05.png) no-repeat 0 0; background-size:cover;}
#contents .sec04 .pie .graph.graph02:after{background:url(/jp/contents/research/graphic/006/sec04_item06.png) no-repeat 0 0; background-size:cover;}

#contents .sec05{background:url(/jp/contents/research/graphic/006/bg.png) repeat-y center center #e0f7fa; padding:30px 0;}
#contents .sec05 div.copy{margin:40px auto; color:#000;}

#contents .sec06{background:url(/jp/contents/research/graphic/006/bg3.png) repeat-x left top; padding:100px 0 30px;}
#contents .sec07{padding:30px 0;}
#contents .sec08{padding:30px 0;}
#contents .sec08 div.copy{margin:20px auto 0;}

#contents .sec09{background:url(/jp/contents/research/graphic/006/bg2.png) repeat-x left top, url(/jp/contents/research/graphic/006/bg.png) repeat-y center center #e0f7fa; padding:100px 0 50px;}
#contents .sec09 div.copy{margin:50px auto 0; color:#000;}

#contents .sec10{background:url(/jp/contents/research/graphic/006/bg3.png) repeat-x left top; padding:100px 0 50px;}
#contents .sec10 h1{margin-bottom:30px;}
#contents .sec10 h2{margin-bottom:30px;}
#contents .sec10 .pie{position:absolute; left:0; top:0; width:100%; height:100%;}
#contents .sec10 .pie .graph{width:36.7%; height:60%; position:absolute; top:37.33%;}
#contents .sec10 .pie .graph.graph01{left:4.18%;}
#contents .sec10 .pie .graph.graph02{left:55.31%;}
#contents .sec10 .pie .graph:after{width:100%; height:100%; position:absolute; left:0; top:0; z-index:10; content:'';}
#contents .sec10 .pie .graph.graph01:after{background:url(/jp/contents/research/graphic/006/sec10_item03.png) no-repeat 0 0; background-size:cover;}
#contents .sec10 .pie .graph.graph02:after{background:url(/jp/contents/research/graphic/006/sec10_item04.png) no-repeat 0 0; background-size:cover;}
#contents .sec10 div.copy{margin:30px auto 0;}

#contents .sec11{background:url(/jp/contents/research/graphic/006/bg2.png) repeat-x left top, url(/jp/contents/research/graphic/006/bg.png) repeat-y center center #e0f7fa; padding:100px 0;}

#contents .sec12{background:url(/jp/contents/research/graphic/006/bg.png) repeat-y center center #e0f7fa; padding:50px 0;}
#contents .sec12 div.copy{margin:50px auto 0; color:#000;}

#contents .sec13{background:url(/jp/contents/research/graphic/006/bg3.png) repeat-x left top; padding:100px 0 50px;}
#contents .sec13 div.copy{margin:30px auto;}




@media screen and (max-width: 767px){
#contents {width:100% !important; height: auto; min-width:0;}
#contents .section .inner,
#contents .fig{width:auto; padding:0; margin:0 10px;}
#contents div.copy{border-radius:10px; padding:70px 10px 10px 10px; width:auto; margin:0 10px; background:url(/jp/contents/research/graphic/006/octpus.png) no-repeat center 10px; background-size:50px;} 
#contents div.copy p{line-height:1.4;}
#contents .fig img{width:100%; height:auto;}
#contents .fig img.placeholder{width:100%; height:auto;}
#contents .section h2,
#contents .section h3{margin-bottom:15px; opacity:1;}
#contents .section h2 img,
#contents .section h3 img{width:100%; height:auto;}


#contents .sec00{padding-top:15px;}
#contents div.bottom{padding:30px 0 25px;}
#contents div.bottom div.copy{background-image:none; padding:10px;}

#contents .sec01{padding:10px 0;}
#contents .sec02{padding:10px 0;}
#contents .sec03{padding:10px 0;}
#contents .sec03 div.copy{margin:25px 10px;}
#contents .sec04{padding:50px 0 25px;}

#contents .sec05{padding:10px 0;}
#contents .sec05 div.copy{margin:25px 10px 0;}

#contents .sec06{padding:50px 0 30px 0;}
#contents .sec07{padding:10px 0;}
#contents .sec08{padding:10px 0;}
#contents .sec08 div.copy{margin:25px 10px;}

#contents .sec09{padding:50px 0 10px;}
#contents .sec09 div.copy{margin:25px 10px 0;}

#contents .sec10{padding:50px 0 0;}
#contents .sec10 h1{margin-bottom:15px;}
#contents .sec10 h2{margin-bottom:15px;}
#contents .sec10 div.copy{margin:25px 10px 0;}
#contents .sec11{padding:50px 0 30px 0;}
#contents .sec12{padding:10px 0;}
#contents .sec12 div.copy{margin:25px 10px 0;}
#contents .sec13{padding:50px 0 30px 0;}
#contents .sec13 div.copy{margin:25px 10px 0;}


















}