@charset "utf-8";
/* body{font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif; color:#333333;} */

#contents{width:100%; color:#fff; -webkit-text-size-adjust:100%;}
#contents p{font-size:14px; line-height:32px; color:#333; -moz-font-feature-settings:"palt"; -webkit-font-feature-settings:"palt"; font-feature-settings:"palt";}
#contents .section h3{opacity:1;}
#contents .section .parts{position:relative; width:940px; margin:0 auto;}
#contents .section img{max-width:940px; width:100%; height:auto; position:relative; z-index:10;}
#contents .section img + img{position:absolute; left:0; top:0;}
#contents .section .graph{position:absolute; left:0; top:0; width:940px; z-index:0; text-align:center;}
#contents .text{width:768px; margin:0 auto; padding:25px 30px 25px 120px; text-align:left; background:#fff; border:1px solid #80cbc4;  border-radius:15px;letter-spacing: 0.1em}

#contents .section .pc-item{display:block;}
#contents .section .sp-item{display:none;}

/* effect */
.parts img{opacity:0; transition:1s cubic-bezier(0.215, 0.61, 0.355, 1),transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1); transform-origin:center center;}
.fadein img {opacity:1;}
.parts img:nth-of-type(1){transition-delay:0.3s;}
.parts img:nth-of-type(2){transition-delay:0.6s;}
.parts img:nth-of-type(3){transition-delay:0.9s;}
.parts img:nth-of-type(4){transition-delay:1.2s;}
.parts img:nth-of-type(5){transition-delay:1.5s;}
.parts img:nth-of-type(6){transition-delay:1.8s;}
.parts img:nth-of-type(7){transition-delay:2.1s;}
.parts img:nth-of-type(8){transition-delay:2.4s;}


/* sec01 */
#contents .sec01{position:relative; z-index: 1; height:612px; padding-top:0; min-width: 1335px; background:url("/jp/contents/research/graphic/012/sec01_bg.png")repeat-x left bottom;}
#contents .sec01.fadein:before{opacity:1;}
#contents .sec01.fadein:after{opacity:1;}
#contents .sec01 h1.parts{width:1335px;padding-top: 23px;}
#contents .sec01 h1.parts img{max-width:1335px}
#contents .sec01 h1.parts img.random01{z-index: 11}
#contents .sec01 h1.parts img.random02{z-index: 10}
#contents .sec01 h1.parts img.random03{z-index: 12}
#contents .sec01 h1.parts img.random04{z-index: 12}
#contents .sec01 h1.parts img.random05{z-index: 10}
#contents .sec01 h1.parts img.random06{z-index: 11}
#contents .sec01 h1.parts img:nth-of-type(3){transition-delay:0.1s}
#contents .sec01 h1.parts img:nth-of-type(4){transition-delay:0.4s}
#contents .sec01 h1.parts img:nth-of-type(5){transition-delay:0.7s}
#contents .sec01 h1.parts img:nth-of-type(6){transition-delay:1.05s}
#contents .sec01 h1.parts img:nth-of-type(7){transition-delay:1.3s}
#contents .sec01 h1.parts img:nth-of-type(8){transition-delay:1.55s}
#contents .sec01 h1.parts img.nomal01{z-index: 100;transition-delay:1.9s;transition-duration: 1.10s; }
#contents .sec01 h1.parts img.nomal02{z-index: 150;transition-delay:2.25s; transition-duration: 1.2s; transform: scale(1.1);}

#contents .sec01 .parts img{z-index:11;position: absolute;top:23px;left:0;right:0;margin:auto;transform:translate(0,-30px);}
#contents .sec01 .fadein .parts img{transform:translate(0,0) scale(1) !important;}
#contents .sec01 .text.memo{position:absolute; top:404px; right:0; left:0; width:768px; margin:auto; padding:20px 115px 20px 25px; background:#fff url(/jp/contents/research/graphic/012/sec01item04.png)no-repeat right 10px top 31px;  z-index:200;border:1px solid #80cbc4; transition-delay:1s;}
#contents .sec01 .text.memo p{color:#0097a7}
#contents .sec01.fadein .text.memo{opacity:1;}


/* sec02 */
#contents .sec02{margin-top:-32px; padding:56px 0 83px; background:#d9f5f9;}
#contents .sec02 .section + h3{margin-top: 50px}
#contents .sec02 h2{margin-bottom:44px;}
#contents .sec02 .parts img{transform:translate(0,30px);}
#contents .sec02 .fadein .parts img{transform:translate(0,0);}
#contents .sec02 .text{margin-top:60px; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat left 29px top 48px;background-size: 77px 111px;padding: 25px 30px 25px 126px;}
#contents .sec02 #sec02_inner .title {transition-delay: 1.8s;}

/* sec03 */
#contents .sec03{position:relative; padding:80px 0 87px; background:#fffde7;}
#contents .sec03:before{content:''; position:absolute; top:0; left:0; width:100%; height:17px; background:#fffde7 url(/jp/contents/research/graphic/012/sec_bg_blue.png) repeat-x left bottom;background-size: 20px auto;}
#contents .sec03:after{content:''; position:absolute; bottom:0; left:0; width:100%; height:28px; background:#d9f5f9 url(/jp/contents/research/graphic/012/sec_bg_yellow.png) repeat-x left bottom;background-size: 20px auto;}
#contents .sec03 h2{margin-bottom:70px;}
#contents .sec03 h3{margin-bottom:50px;}
#contents .sec03 h2 + p{margin-bottom:12px; color:#00bcd4; line-height:28px; font-weight:bold;}
#contents .sec03 .parts img:nth-of-type(1),#contents .sec03 .parts img:nth-of-type(2),#contents .sec03 .parts img:nth-of-type(3){transform:translate(0,-30px);}
#contents .sec03 .fadein .parts img{transform:translate(0,0);}
#contents .sec03 .text{margin-top:81px; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat left 29px top 48px;background-size: 77px 111px;padding: 25px 30px 25px 126px;}

/* sec04 */
#contents .sec04{padding:69px 0 70px; background:#d9f5f9;}
#contents .sec04 h2{margin-bottom:68px;}
#contents .sec04 h3{margin-bottom:40px;}
#contents .sec04 .section + h3{margin-top:100px;}
#contents .sec04-1{margin-bottom:77px;}
#contents .sec04-1 .parts img:first-of-type{opacity:1; z-index:11;}
#contents .sec04-1 .parts img:nth-of-type(2),
#contents .sec04-1 .parts img:nth-of-type(3),
#contents .sec04-1 .parts img:nth-of-type(4){transform:translate(0,80px);}
#contents .sec04-1 .parts img.coin00{width:110px;height:62px;position: absolute;left:229px;top:80px;}
#contents .sec04-1 .parts img.coin01{width:151px;height:152px;transform:translate(210px,150px) rotate(180deg);}
#contents .sec04-1 .parts img.coin02{width:235px;height:180px;transform:translate(140px,180px) rotate(-180deg);}
#contents .sec04-1 .parts img.coin03{width:162px;height:142px;transform:translate(190px,180px) rotate(-180deg);}
#contents .sec04-1.fadein .parts img.coin01{transform:translate(400px,34px) rotate(0);}
#contents .sec04-1.fadein .parts img.coin02{transform:translate(303px,191px) rotate(0);}
#contents .sec04-1.fadein .parts img.coin03{transform:translate(513px,248px) rotate(0);}

#contents .sec04-2 .parts img.coin01{width:151px;height:152px;transform:translate(332px,48px);z-index: 90}
#contents .sec04-2 .parts img.coin02{width:166px;height:165px;transform:translate(487px,30px);z-index: 90 }
#contents .sec04-2 .parts img.coin03{width:110px;height:111px;transform:translate(351px,279px);z-index: 150}
#contents .sec04-2 .parts img.coin04{width:235px;height:171px;transform:translate(400px,188px);z-index:100;}
#contents .sec04-2 .parts img.coin05{width:98px;height:97px;transform:translate(441px,319px);z-index: 105}
#contents .sec04-2 .parts img.coin06{width:163px;height:100px;transform:translate(498px,273px);z-index:103; }
#contents .sec04-2.fadein .parts img.coin01{transform:translate(332px,18px) rotate(0);}
#contents .sec04-2.fadein .parts img.coin02{transform:translate(487px,0) rotate(0);}
#contents .sec04-2.fadein .parts img.coin03{transform:translate(351px,209px) rotate(0);}
#contents .sec04-2.fadein .parts img.coin04{transform:translate(400px,125px) rotate(0);}
#contents .sec04-2.fadein .parts img.coin05{transform:translate(441px,289px) rotate(0);}
#contents .sec04-2.fadein .parts img.coin06{transform:translate(498px,243px) rotate(0);}



#contents .sec04 .text{margin-top:81px; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat left 29px top 48px;background-size: 77px 111px;padding: 25px 30px 25px 126px;}

/* sec05 */
#contents .sec05{position:relative; padding:89px 0 96px; background:#fffde7;}
#contents .sec05:before{content:''; position:absolute; top:0; left:0; width:100%; height:26px; background:#fffde7 url(/jp/contents/research/graphic/012/sec_bg_blue.png) repeat-x left bottom;background-size: 20px auto;}
#contents .sec05:after{content:''; position:absolute; bottom:0; left:0; width:100%; height:19px; background:#d9f5f9 url(/jp/contents/research/graphic/012/sec_bg_yellow.png) repeat-x left bottom;background-size: 20px auto;}
#contents .sec05 h2{margin-bottom:83px;}
#contents .sec05 h3:first-of-type{margin-bottom:47px;}
#contents .sec05 h3:nth-of-type(2){margin-bottom:35px;}
#contents .sec05-1{margin-bottom:79px;}
#contents .sec05-1 .parts img:nth-of-type(4),
#contents .sec05-1 .parts img:nth-of-type(5),
#contents .sec05-1 .parts img:nth-of-type(6){transform:translate(0,30px);}
#contents .sec05-1.fadein .parts img:nth-of-type(4),
#contents .sec05-1.fadein .parts img:nth-of-type(5),
#contents .sec05-1.fadein .parts img:nth-of-type(6){transform:translate(0,0);}
#contents .sec05-2 .parts img:nth-of-type(1),
#contents .sec05-2 .parts img:nth-of-type(2){opacity:1;}
#contents .sec05-2 .parts img:nth-of-type(3),
#contents .sec05-2 .parts img:nth-of-type(4){transform:translate(0,-30px);}
#contents .sec05-2.fadein .parts img:nth-of-type(3),
#contents .sec05-2.fadein .parts img:nth-of-type(4){transform:translate(0,0);}
#contents .sec05-2 .graph{width:359px; height:359px; left:2px; top:197px;}
#contents .sec05-2 .graph + .graph{top:207px; left:469px;}
#contents .sec05 .text{margin-top:81px; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat left 29px top 48px;background-size: 77px 111px;padding: 25px 30px 25px 126px;}

/* sec06 */
#contents .sec06{position:relative; padding:93px 0 65px; background:#d9f5f9 }
#contents .sec06:after{content:''; position:absolute; bottom:0; left:0; width:100%; height:19px; background:#fffde7  url(/jp/contents/research/graphic/012/sec_bg_blue.png) repeat-x left bottom;background-size: 20px auto;}
#contents .sec06 h2{margin-bottom:67px;}
#contents .sec06 .top{position:relative; z-index:100;}
#contents .sec06 .text{margin-top:77px; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat left 29px top 17px;background-size: 77px 111px;padding: 25px 30px 25px 126px;}

/* sec07 */
#contents .sec07{position:relative; padding:93px 0 65px; background:#fffde7 }
#contents .sec07 h2{margin-bottom:67px;}
#contents .sec07 .top{position:relative; z-index:100;}
#contents .sec07 .text{margin-top:54px; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat left 29px top 17px;background-size: 77px 111px;padding: 25px 30px 25px 126px;}




@media screen and (max-width:767px){
/*
	mobile 
*/
#contents{min-width:inherit; border:none; overflow:hidden;}
#contents p{font-size:2.6vw; line-height:2;letter-spacing: 0.07em}
#contents .section .parts{width:100%;}
#contents .section img{max-width:100%;}
#contents .section .graph{width:100%;}
/*#contents .section{padding:10.416667vw 0}*/
#contents .section h2{margin-bottom:5.215124vw!important;}
#contents .section h3{margin-bottom:4.563233vw!important;}
#contents .text{width:94%; margin:5.208333vw auto 0!important; padding:17.731421vw 2.833333vw 9.114583vw; border-radius:1.953125vw;}

#contents .section .pc-item{display:none;}
#contents .section .sp-item{display:block;}


/* sec01 */
#contents .sec01{position: relative;width:100%;height:108vw;  background:url(/jp/contents/research/graphic/012/sec01_bg.png) repeat-x left bottom / 2.607vw auto; min-width: inherit; }
#contents .sec01 h1.parts {width:100%;height:auto;padding-top: 0}
#contents .sec01 h1.parts img{width:94%; left:0;right:0;margin:auto}
#contents .sec01 .text.memo{position: absolute;top:50vw; width:94%; margin:0 auto!important; padding:17.731421vw 2.833333vw 4.688vw; background-size: 10.299vw 11.47327vw ; background-position:center 4.302477vw;}

/* sec02 */
#contents .sec02{padding:11vw 0 5.5vw;  margin-top: -4.172vw;}
#contents .sec02 .parts{width:94%; margin:0 auto}
#contents .sec02 .parts img{transform:translate(0,4.688vw);}
#contents .sec02 .fadein .parts img{transform:translate(0,0);}
#contents .sec02 .text{margin-top:6.383vw; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat center top 3.3vw;background-size: 8.191vw 11.809vw;padding:17.731421vw 2.833333vw 4.688vw;}

/* sec03 */
#contents .sec03{padding:9.5vw 0 7.7vw;}
#contents .sec03:before{height:2.656vw; background-position:left bottom; background-size:2.6vw auto;}
#contents .sec03:after{height:4.375vw; background-position:left bottom; background-size:2.6vw auto;}
#contents .sec03 h2 + p{width:94%; margin:0 auto 2.344vw; text-align:left; line-height:2;}
#contents .sec03 .parts{width:94%; margin:0 auto}
#contents .sec03 .parts img:nth-of-type(2),
#contents .sec03 .parts img:nth-of-type(4){transform:translate(0,4.688vw);}
#contents .sec03 .parts img:nth-of-type(3){transform:translate(0,-4.688vw);}
#contents .sec03 .fadein .parts img{transform:translate(0,0);}
#contents .sec03 .text{margin-top:6.383vw; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat center top 3.3vw;background-size: 8.191vw 11.809vw;padding:17.731421vw 2.833333vw 4.688vw;}
#contents .sec02 .section + h3 {margin-top: 6.519vw;}
  

/* sec04 */
#contents .sec04{padding:7vw 0 4.3vw;}
#contents .sec04 .section + h3 { margin-top: 13.0378vw;}
#contents .sec04 .text{margin-top:6.383vw; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat center top 3.3vw;background-size: 8.191vw 11.809vw;padding:17.731421vw 2.833333vw 4.688vw;}
#contents .sec04 .parts{width:96%}
#contents .sec04-1 .parts img.coin00{width:14.342vw;height:auto;position: absolute;left:24.3617vw;top:-5vw;}
#contents .sec04-1 .parts img.coin01{width:18.557vw;height:auto;transform:translate(23.6vw,15.14893vw) rotate(180deg);}
#contents .sec04-1 .parts img.coin02{width:29.639vw;height:auto;transform:translate(16.957vw,21.532vw) rotate(-180deg);}
#contents .sec04-1 .parts img.coin03{width:16.23404vw;height:auto;transform:translate(23.617vw,21.532vw) rotate(-180deg);}
#contents .sec04-1.fadein .parts img.coin01{transform:translate(42.55319vw,3.31702vw) rotate(0);}
#contents .sec04-1.fadein .parts img.coin02{transform:translate(32.23404vw,22vw) rotate(0);}
#contents .sec04-1.fadein .parts img.coin03{transform:translate(60.57446vw,26.38297vw) rotate(0);}
#contents .sec04-1.fadein .parts img:last-of-type{width:90%;right:0;left:10vw;}

#contents .sec04-2 .parts img.coin01{width:17.557vw;height:auto;transform:translate(35.319vw,23.468vw);}
#contents .sec04-2 .parts img.coin02{width:15.65957vw;height:auto;transform:translate(50vw,3.911vw);z-index: 90 }
#contents .sec04-2 .parts img.coin03{width:9.70212vw;height:auto;transform:translate(37.34vw,36.506vw);z-index: 150}
#contents .sec04-2 .parts img.coin04{width:23vw;height:auto;transform:translate(42.553vw,24.772vw);z-index:100;}
#contents .sec04-2 .parts img.coin05{width:8.42553vw;height:auto;transform:translate(45vw,41.721vw);z-index: 105}
#contents .sec04-2 .parts img.coin06{width:17.34042vw;height:auto;transform:translate(52.979vw,35.593vw);z-index:103; }
#contents .sec04-2.fadein .parts img.coin01{transform:translate(33.319vw,1.915vw) rotate(0);}
#contents .sec04-2.fadein .parts img.coin02{transform:translate(53vw,0) rotate(0);}
#contents .sec04-2.fadein .parts img.coin03{transform:translate(35.34vw,22.34vw) rotate(0);}
#contents .sec04-2.fadein .parts img.coin04{transform:translate(40.553vw,13.298vw) rotate(0);}
#contents .sec04-2.fadein .parts img.coin05{transform:translate(48vw,29vw) rotate(0);}
#contents .sec04-2.fadein .parts img.coin06{transform:translate(53vw,25vw) rotate(0);}
#contents .sec04-2.fadein .parts img:last-of-type{width:90%;right:0;left:10vw;}

/* sec05 */
#contents .sec05{padding:10.5vw 0 7.9vw;}
#contents .sec05:before{height:4.063vw; background-position:left bottom; background-size:2.6vw auto;}
#contents .sec05:after{height:2.969vw; background-position:left bottom; background-size:2.6vw auto;}
#contents .sec05 .parts{width:94%; margin:0 auto}
#contents .sec05 .parts img:nth-of-type(4),
#contents .sec05 .parts img:nth-of-type(5),
#contents .sec05 .parts img:nth-of-type(6){transform:translate(0,4.688vw);}
#contents .sec05.fadein .parts img:nth-of-type(4),
#contents .sec05.fadein .parts img:nth-of-type(5),
#contents .sec05.fadein .parts img:nth-of-type(6){transform:translate(0,0);}
#contents .sec05 .text{margin-top:6.383vw; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat center top 3.3vw;background-size: 8.191vw 11.809vw;padding:17.731421vw 2.833333vw 4.688vw;}

/* sec06 */
#contents .sec06{padding:7.1vw 0 7.9vw;}
#contents .sec06:after{height:2.969vw; background-position:left bottom; background-size:2.6vw auto;}
#contents .sec06 .parts{width:94%; margin:0 auto}
#contents .sec06 .text{margin-top:6.383vw; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat center top 3.3vw;background-size: 8.191vw 11.809vw;padding:17.731421vw 2.833333vw 4.688vw;}

#contents .sec07{padding:7vw 0 7.9vw;}
#contents .sec07 .parts{width:94%; margin:0 auto}
#contents .sec07 .text{margin-top:6.383vw; background:#fff url(/jp/contents/research/graphic/012/canning.png) no-repeat center top 3.3vw;background-size: 8.191vw 11.809vw;padding:17.731421vw 2.833333vw 4.688vw;}