|
|
Line 376: |
Line 376: |
| } | | } |
| /* 動畫 */ | | /* 動畫 */ |
− | .tit h1 { | + | #font.tit h1 { |
| text-align: center; | | text-align: center; |
| font-size: 120px; | | font-size: 120px; |
Line 442: |
Line 442: |
| .advisorhr { | | .advisorhr { |
| background-color: #f19181; | | background-color: #f19181; |
| + | } |
| + | |
| } | | } |
| | | |
| | | |
| | | |
− | @media (min-width:10240px) {
| |
− | .part {
| |
− | width: auto;
| |
− | height: 100px;
| |
− | text-align: center;
| |
− | }
| |
− | .part h1 {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | font-size: 90px;
| |
− | }
| |
− | .flip {
| |
− | -webkit-perspective: 800;
| |
− | perspective: 800;
| |
− | }
| |
− | .flip .card.flipped {
| |
− | -webkit-transform: rotatey(-180deg);
| |
− | -moz-transform: rotatey(-180deg);
| |
− | -o-transform: rotatey(-180deg);
| |
− | transform: rotatey(-180deg);
| |
− | }
| |
− | .flip .card {
| |
− | width: 300px;
| |
− | height: 400px;
| |
− | margin: auto;
| |
− | -webkit-transform-style: preserve-3d;
| |
− | -webkit-transition: 0.5s;
| |
− | -moz-transform-style: preserve-3d;
| |
− | -moz-transition: 0.5s;
| |
− | -o-transform-style: preserve-3d;
| |
− | -o-transition: 0.5s;
| |
− | transform-style: preserve-3d;
| |
− | transition: 0.5s;
| |
− | background-color: #fff;
| |
− | }
| |
− | .flip .card .namecard {
| |
− | -webkit-backface-visibility: hidden;
| |
− | -moz-backface-visibility: hidden;
| |
− | -o-backface-visibility: hidden;
| |
− | backface-visibility: hidden;
| |
− | z-index: 2;
| |
− | }
| |
− | .flip .card .front {
| |
− | position: absolute;
| |
− | width: 300px;
| |
− | height: 400px;
| |
− | letter-spacing: 1px;
| |
− | margin: auto;
| |
− | border-radius: 15px;
| |
− | overflow: hidden;
| |
− | z-index: 100;
| |
− | cursor: pointer;
| |
− | background-color: rgba(255, 255, 255, 1);
| |
− | letter-spacing: 1px;
| |
− | color: rgb(8, 7, 1);
| |
− | border-radius: 15px;
| |
− | overflow: hidden;
| |
− | cursor: pointer;
| |
− | border: 10px solid transparent;
| |
− | padding: 15px;
| |
− | -webkit-border-image: url(/assets/img/border.png) 20% stretch;
| |
− | -moz-border-image: url(/assets/img/border.png) 20% stretch;
| |
− | /* Safari 3.1-5 */
| |
− | -o-border-image: url(/assets/img/border.png) 20% stretch;
| |
− | /* Opera 11-12.1 */
| |
− | border-image: url(/assets/img/border.png) 20% stretch;
| |
− | z-index: 1;
| |
− | }
| |
− | .flip .card .back {
| |
− | width: 300px;
| |
− | height: 400px;
| |
− | letter-spacing: 1px;
| |
− | margin: auto;
| |
− | border-radius: 15px;
| |
− | overflow: hidden;
| |
− | z-index: 100;
| |
− | cursor: pointer;
| |
− | background-color: rgba(255, 255, 255, 1);
| |
− | letter-spacing: 1px;
| |
− | color: rgb(8, 7, 1);
| |
− | border-radius: 15px;
| |
− | overflow: hidden;
| |
− | border: 10px solid transparent;
| |
− | padding: 15px;
| |
− | -webkit-border-image: url(/assets/img/border.png) 20% stretch;
| |
− | -moz-border-image: url(/assets/img/border.png) 20% stretch;
| |
− | /* Safari 3.1-5 */
| |
− | -o-border-image: url(/assets/img/border.png) 20% stretch;
| |
− | /* Opera 11-12.1 */
| |
− | border-image: url(/assets/img/border.png) 20% stretch;
| |
− | padding-top: 10%;
| |
− | -webkit-transform: rotatey(-180deg);
| |
− | -moz-transform: rotatey(-180deg);
| |
− | -o-transform: rotatey(-180deg);
| |
− | transform: rotatey(-180deg);
| |
− | }
| |
− | .namecard img {
| |
− | position: absolute;
| |
− | width: 250px;
| |
− | height: 250px;
| |
− | margin: auto;
| |
− | border-radius: 8px;
| |
− | box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.2);
| |
− | transition-duration: 0.4s;
| |
− | }
| |
− | .txt {
| |
− | position: absolute;
| |
− | width: 250px;
| |
− | height: 100px;
| |
− | top: 280px;
| |
− | text-align: center;
| |
− | }
| |
− | .txt h2 {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | font-size: 28px;
| |
− | color: #091d20;
| |
− | letter-spacing: 2px;
| |
− | }
| |
− | .txt h5 {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | color: #0094ad;
| |
− | font-size: 24px;
| |
− | letter-spacing: 4px;
| |
− | }
| |
− | .txt span {
| |
− | color: rgb(129, 104, 182);
| |
− | font-size: 11px;
| |
− | }
| |
− | .card .back h2 {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | font-size: 24px;
| |
− | letter-spacing: 6px;
| |
− | }
| |
− | .card .back span {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | padding: 0px;
| |
− | font-size: 18px;
| |
− | color: #0094ad;
| |
− | letter-spacing: 2px;
| |
− | }
| |
− | .card .back h5 {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | color: #0094ad;
| |
− | font-size: 22px;
| |
− | letter-spacing: 4px;
| |
− | }
| |
− | .card .back p {
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | width: 22 em;
| |
− | word-wrap: break-word;
| |
− | font-size: 24px;
| |
− | font-weight: 900;
| |
− | word-wrap: break-word;
| |
− | color: rgba(13, 1, 6, 0.96);
| |
− | line-height: 24px;
| |
− | /*display: block;*/
| |
− | }
| |
− | .flip .card .namecard .logo {
| |
− | width: 80px;
| |
− | height: 106px;
| |
− | border-radius: 100%;
| |
− | position: absolute;
| |
− | transition-duration: 0.5s;
| |
− | right: 0px;
| |
− | bottom: -20px;
| |
− | background-image: url(/assets/img/fish.png);
| |
− | }
| |
− | /* 動畫 */
| |
− | .tit h1 {
| |
− | /*position: absolute;*/
| |
− | text-align: center;
| |
− | font-size: 120px;
| |
− | font-family: 'Montserrat', sans-serif;
| |
− | color: rgb(55, 55, 55);
| |
− | font-weight: bold;
| |
− | letter-spacing: 5px;
| |
− | /*font-family: 'Open Sans', sans-serif;*/
| |
− | }
| |
− | .tit {
| |
− | height: 200px;
| |
− | /*border: 2px solid rgb(173, 83, 213);*/
| |
− | }
| |
− | }
| |
| | | |
| | | |