@charset "utf-8";

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


#contents {min-width:960px; width: 100%; color:#fff; -webkit-text-size-adjust:100%; background:url(/jp/contents/research/graphic/008/bg.jpg); border-top:1px solid #cc3d3d;}
#contents p {font-size: 14px; line-height: 32px; color: #333;}

#contents .section .inner{width:100%; margin:0 auto; position:relative; clear:both;}
#contents .section .inner:after{content:''; display:block; clear:both;}
#contents .section .parts {position: relative; width: 960px; margin: 0 auto;}
#contents .section img{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: 960px; z-index: 0; text-align: center;}

#contents div.text {margin-top: 40px;}
#contents div.text p {width: 768px; margin: 0 auto; text-align: left; border-radius: 15px; background:url(../graphic/008/source.png) 33px center no-repeat rgba(255,171,145,0.3); padding: 30px 30px 30px 94px;}
#contents div.text.memo {background: rgba(255,171,145,0.3); margin-top: -31px;}
#contents div.text.memo p{padding: 70px 160px 70px 30px; background:url(../graphic/008/note.png) right 33px center no-repeat;}

#contents .nav {margin-top:76px;}
#contents .section {padding-top: 76px;}
#contents .section h2 {margin-bottom: 40px;}
#contents .section h2 img {width: 720px;}
#contents .sec01 {padding-top: 40px;}

/* 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(2) {transition-delay: 0.5s;}
.parts img:nth-of-type(3) {transition-delay: 1.0s;}
.parts img:nth-of-type(4) {transition-delay: 1.5s;}
.parts img:nth-of-type(5) {transition-delay: 2.0s;}

/* sec01 */
.sec01 .parts img:nth-of-type(3) {transform: translate(0,-30px);}
.sec01.fadein .parts img:nth-of-type(3){transform: translate(0,0);}

/* sec02 sec07  sec10 */
.sec02 .parts img,
.sec07 .parts img,
.sec10 .parts img{transform: translate(0,-30px);}
.sec02 .fadein .parts img,
.sec07.fadein .parts img,
.sec10.fadein .parts img{transform: translate(0,0);}

/* sec03 */
.sec03 .parts img:nth-of-type(2),
.sec03 .parts img:nth-of-type(3) {transform: translate(0,30px);}
.sec03.fadein .parts img:nth-of-type(2),
.sec03.fadein .parts img:nth-of-type(3){transform: translate(0,0);}

/* sec04 */
#contents .sec04 {padding-top: 25px;}
.sec04 .parts img:nth-of-type(1) {opacity: 1;}
#contents .section .sec04 .graph {width: 360px; height: 360px; left: 303px; top: 78px;}
.sec04 .parts img:nth-of-type(2) {transition-delay: 1.2s; transform: translate(0,-30px);}
.sec04 .parts img:nth-of-type(3) {transition-delay: 1.7s; transform: translate(0,-30px);}
.sec04.fadein .parts img:nth-of-type(2),
.sec04.fadein .parts img:nth-of-type(3) {transform: translate(0,0);}

/* sec05 */
.sec05 .parts img:nth-of-type(2),
.sec05 .parts img:nth-of-type(3) {transform:translate(0,30px);}
.sec05.fadein .parts img:nth-of-type(2),
.sec05.fadein .parts img:nth-of-type(3){transform:translate(0,0);}

/* sec06 */
.sec06 .parts img {transform:translate(0,-30px); transition-delay: 0;}
#contents .section .sec06 .parts img.pop {z-index: 20;}


#contents .section .sec06.fadein .parts img:nth-of-type(12){transition-delay: 0.5s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(11){transition-delay: 1.55s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(10){transition-delay: 1.8s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(9){transition-delay: 2.05s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(8){transition-delay: 0.5s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(7){transition-delay: 1.45s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(6){transition-delay: 1.6s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(5){transition-delay: 1.75s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(4){transition-delay: 1.9s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(3){transition-delay: 2.05s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(2){transition-delay: 2.5s; transform: translate(0,0);}
#contents .section .sec06.fadein .parts img:nth-of-type(1){transition-delay: 2.8s; transform: translate(0,0);}


/* sec08 */
#contents .section .sec08 .parts img:nth-of-type(1) {opacity: 1;}
#contents .section .sec08 .graph {width: 360px; height: 360px; left: 12px; top: 76px;}
#contents .section .sec08 .graph + .graph {left: 596px;}
.sec08 .parts img:nth-of-type(2) {transition-delay: 1.2s; transform: translate(0,-30px);}
.sec08 .parts img:nth-of-type(3) {transition-delay: 1.7s; transform: translate(0,-30px);}
.sec08.fadein .parts img:nth-of-type(2),
.sec08.fadein .parts img:nth-of-type(3) {transform: translate(0,0);}

/* sec09 */
#contents .sec09 .parts {width: 770px;}

/* sec11 */
#contents .section .sec11.animation{opacity: 1;}
#contents .section .sec11 .parts img {z-index: 10;}
#contents .section .sec11 .parts img.desk {opacity: 1; z-index: 20;}
#contents .section .sec11 .parts img.katu {z-index: 30;}
#contents .section .sec11 .parts img:nth-child(1),
#contents .section .sec11 .parts img:nth-child(5) {transition-delay: 0s;}
#contents .section .sec11 .parts img:nth-child(2),
#contents .section .sec11 .parts img:nth-child(6) {transition-delay: 0.5s;}
#contents .section .sec11 .parts img:nth-child(3),
#contents .section .sec11 .parts img:nth-child(7) {transition-delay: 1.0s;}


@media screen and (max-width: 767px){
/*
	mobile 
*/
#contents {min-width: inherit; border: none; overflow: hidden;}
#contents p {font-size: 18px; line-height: 2;}
#contents .section .parts {width: 100%;}
#contents .section h2 img{width: 94%;}

#contents .nav {margin-top: 10.416667vw;}

#contents div.text {margin-top: 5.208333vw;}
#contents div.text p {width:94%; margin: 0 3%; border-radius: 1.953125vw; background:url(../graphic/008/source.png) center 3.40625vw no-repeat rgba(255,171,145,0.3); padding:12.90625vw 2.833333vw 3.90625vw ; background-size:3.408333vw auto; -moz-font-feature-settings: "palt"; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; letter-spacing: 0.1em;}
#contents div.text.memo {margin-top: -3.90625vw;}
#contents div.text.memo p{padding:18.114583vw 2.833333vw 9.114583vw; background:url(../graphic/008/note.png) no-repeat center 3vw; background-size: 10.364583vw auto;}

#contents .section {padding-top: 10.416667vw;}
#contents .sec01 {padding-top: 5.208333vw;}
#contents .sec01 h1 img {width: 126%; left: -13%;}

/* sec01 */
.sec01 .parts img:nth-of-type(3) {transform: translate(0,-3.90625vw);}

/* sec02 sec07 sec10 */
.sec02 .parts img,
.sec07 .parts img,
.sec10 .parts img {transform: translate(0,-3.90625vw);}

/* sec03 */
.sec03 .parts img:nth-of-type(2),
.sec03 .parts img:nth-of-type(3) {transform: translate(0,3.90625vw);}

/* sec04 */
#contents .sec04 {padding-top: 3.90625vw;}
#contents .section .sec04 .graph {width: 45%; height: 45%; left:28%; top:6%;}
.sec04 .parts img:nth-of-type(2) {transition-delay: 1.2s; transform: translate(0,-3.90625vw);}
.sec04 .parts img:nth-of-type(3) {transition-delay: 1.7s; transform: translate(0,-3.90625vw);}

/* sec05 */
.sec05 .parts img:nth-of-type(2),
.sec05 .parts img:nth-of-type(3) {transform:translate(0,3.90625vw);}
.sec05.fadein .parts img:nth-of-type(2),
.sec05.fadein .parts img:nth-of-type(3){transform:translate(0,0);}

/* sec06 */
.sec06 .parts img {transform:translate(0,-3.90625vw); transition-delay: 0;}

/* sec08 */
#contents .section .sec08 .graph {width: 38%; height: 38%; left: 1%; top: 11%;}
#contents .section .sec08 .graph + .graph {left: 61.6%;}
.sec08 .parts img:nth-of-type(2) {transition-delay: 1.2s; transform: translate(0,-3.90625vw);}
.sec08 .parts img:nth-of-type(3) {transition-delay: 1.7s; transform: translate(0,-3.90625vw);}

/* resize */
#contents .sec02 .parts img,
#contents .sec03 .parts img,
#contents .sec09 .parts img,
#contents .sec06 .parts img,
#contents .sec07 .parts img,
#contents .sec10 .parts img,
#contents .sec11 .parts img {width: 94%}
#contents .sec02 .parts img + img,
#contents .sec03 .parts img + img,
#contents .sec06 .parts img + img,
#contents .sec07 .parts img + img,
#contents .sec09 .parts img + img,
#contents .sec10 .parts img + img,
#contents .sec11 .parts img + img {left: 3%;}


}
@media screen and (max-width: 641px){
/*
	mobile 
*/
#contents p {font-size: 3.2vw;}




}