
@charset "utf-8";

/*===================================================================
  CSS Import
===================================================================*/
@import url(./ress.css);

/*===================================================================
  Common
===================================================================*/
html{ width:100%; min-width:900px; height:100%; }
body{ width:100%; height:100%; color:#000000; background-color: #ffffff; font-size:16px; font-family:'Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',Meiryo,メイリオ,Osaka,'MS PGothic',arial,helvetica,sans-serif; }
p{ line-height:180%; }
a{ color:#000000; text-decoration:underline; }
a:hover{ color:#a40072; text-decoration:underline; }
div{ position:relative; }
div:after{ content:''; clear:both; display:block; }
img{ display:inline-block; width:100%; height:auto; }

/*===================================================================
  index
===================================================================*/
.leftBtnWrapper{ position:fixed; width:900px; top:0; left:0; right:0; margin:auto; z-index:9998; }
.leftBtn{ width:240px; height:116px; position:absolute; top:160px; right:0; }
.leftBtn > a{ display:block; width:240px; height:48px; margin-bottom:10px; }
.leftBtn > a:hover{ opacity:0.6; }

.mainBodyWideWrapper{ width:100%; height:720px; background-image:url(../../img/mainBodyWideBg.jpg); background-size:cover; background-position:center bottom; }
.mainBodyWideBody{ width:900px; margin:auto; padding-top:20px; }
.mainBodyWrapper{ width:900px; margin:auto; padding-top:150px; }
.mainBody{ width:630px; }

.mbBoxInfo{ width:630px; background-color: rgba(255, 255, 255, 0.1); border:solid 2px #a40072; margin-bottom:2rem; }
.mbBoxInfo> p{ font-size:1.8rem; font-weight:bold; padding:1rem; color:#a40072; line-height:150%;}

.mbBox01{ width:630px; height:2.7rem; background-color:#FFAAFF; border-radius:1.5rem; }
.mbBox01 > p{ font-size:1.5rem; font-weight:bold; line-height:3rem; padding-left:2rem; }
.mbBox02{ width:630px; margin-top:10px; }
.mbBox02> p{ font-size:1.2rem; font-weight:bold; margin-bottom:1.5rem; }
.mbBox03{ width:240px; height:220px; background-image:url(../../img/mbBox03Img.svg); background-size:10rem; background-position:right 4rem; margin-top:3rem; background-repeat: no-repeat; }
.mbBox03 > p{ display:table-cell; text-align:center; color:#e01f1f; font-size:1.7rem; font-weight:bold; line-height:2rem; text-shadow: 1px 2px 3px #b9c2ca; }

.mbBox04{}
.mbBox04 p{ margin-bottom:15px; }
.mbBox05{}
.mbBox05 > div:nth-of-type(1){ float:left; width:500px; }
.mbBox05 > div:nth-of-type(2){ float:left; width:111px; margin-left:19px; }
.mbBox05 p{ margin-bottom:15px; }
.mbBox16 > a:hover{ opacity:0.6; }

.mbBox06{ width:630px; height:3rem; margin-top:20px; background-color:#ffffff; border-radius:1.5rem; }
.mbBox06 > p{ font-size:1.5rem; font-weight:bold; line-height:3rem; padding-left:2rem; }
.mbBox07{ margin-top:10px; }
.mbBox07 > p:nth-of-type(1){ font-size:1.2rem; font-weight:bold; }
.mbBox07 > p:nth-of-type(2){ }

.mbBox08{ width:630px; height:3rem; margin-top:50px; background-color:#FFAAFF; border-radius:1.5rem; }
.mbBox08 > p{ font-size:1.5rem; font-weight:bold; line-height:3rem; padding-left:2rem; }
.mbBox09{ margin-top:10px; }
.mbBox09 > p:nth-of-type(1){ font-size:1.6rem; font-weight:bold; }
.mbBox09 > p:nth-of-type(2){ font-weight:bold; }
.mbBox09 > p > span{ font-size:1.2rem; font-weight:bold; }
.mbBox09 a:hover{ opacity:0.6; }

.mbBox10{ width:630px; height:3rem; margin-top:50px; background-color:#ffe56f; border-radius:1.5rem; }
.mbBox10 > p{ font-size:1.5rem; font-weight:bold; line-height:3rem; padding-left:2rem; }
.mbBox11{ margin-top:10px; }
.mbBox11 > p:nth-of-type(1){ font-size:1.6rem; font-weight:bold; }
.mbBox11 > p:nth-of-type(2){ }

.mbBox12{ margin-top:50px; }
.mbBox12 > a:nth-of-type(1){ float:left; display:block; width:308px; height:58px; }
.mbBox12 > a:nth-of-type(2){ float:left; display:block; width:308px; height:58px; margin-left:14px; }
.mbBox12 > a:hover{ opacity:0.6; }

.mbBox13{ margin-top:10px; }
.mbBox13 > p{}

.mbBox14{ margin-top:30px; }
.mbBox14 > p{ display:block; width:630px; height:3rem; font-size:1.1rem; color:#ffffff; line-height:3rem; text-align:center; background-color:#aa0077; border-radius:1.5rem; }
.mbBox14 > a:hover{ opacity:0.6; }

.mbBox15{ margin-top:10px; }
.mbBox15 > p{ width:630px; font-size:1rem; text-align:center; }

/*===================================================================
  Header
===================================================================*/
.header{ position:fixed; width:100%; height:140px; top:0; left:0; z-index:9999; background-color:#cf0032; }
.headerSpacer{ width:100%; height:140px; }
.headerBody{ width:900px; height:140px; margin:auto; }
.headerLogo{ width:677px; height:110px; position:absolute; top:15px; left:0; }
.headerLogoPharmaTrain{ width:189px; height:55px; position:absolute; top:15px; right:0; }

/*===================================================================
  Footer
===================================================================*/
.footerBtnPgTop{ clear:both; width:100%; height:64px; margin-top:100px; }
.btnPgTop{ width:80px; height:64px; margin:auto; }
.btnPgTop:hover{ cursor:pointer; opacity:0.6; }
.footer{ width:100%; color: #8b0000; background-color:#FFBBFF; }
.footerBody{ width:900px; margin:auto; padding-top:30px; }
.footerBodyStrL{ float:left; width:450px; }
.footerBodyStrL > p:nth-of-type(1){ font-size:1.2rem; font-weight:bold; }
.footerBodyStrL > p:nth-of-type(2){}
.footerBodyStrR{ float:left; width:450px; }
.footerBodyStrR > p:nth-of-type(1){ font-size:1.2rem; font-weight:bold; }
.footerBodyStrR > p:nth-of-type(2){}
.footerBanner{ width:900px; height:80px; margin:auto; margin-top:20px; padding-top:20px; border-top:solid 1px #000000; }
.footerBanner > div:nth-of-type(1){ float:left; width:378px; height:44px; margin-left:20px; }
.footerBanner > div:nth-of-type(2){ float:right; width:438px; height:38px; margin-right:20px; }
.footerBanner a:hover{ opacity:0.6; }

.footerBanner2{ margin-top:1rem; text-align:center; }
.footerBanner2 > a{ display:flex; }
.footerBanner2 > a > img{ width:2rem; margin-right:0.5rem; }
