画像差し替え・TOPエリア作成

common.css

@@ -302,12 +302,54 @@ article {
 
 
 ********************************************************** */
 ********************************************************** */
 
 
+/*PC表示用CSSを記述*/
+#dt_retympa .top_area {
+ width: 100%;
+ margin: 10px 0;
+ border: 2px solid #8bc886;
+ display: flex;
+ -webkit-justify-content: space-between;
+ justify-content: space-between;
+}
 
 
+#dt_retympa .top_area .upper_text {
+ position: absolute;
+ margin: 3px 0 0 72px;
+ font-weight: 600;
+}
 
 
-/*PC表示用CSSを記述*/
+#dt_retympa .top_area .under_text {
+ position: absolute;
+ margin: 68px 0 0 72px;
+ font-weight: 600;
+ border-top: 1px solid #8bc886;
+}
+
+#dt_retympa .top_area .under_text span {
+ font-size: 80%;
+ margin-left: 25px;
+}
 
 
+#dt_retympa .top_area .retympa_logo {
+ width: 400px;
+ height: 48px;
+ padding: 22px 0 0 15px;
+}
 
 
+#dt_retympa .top_area .retympa_right {
+ width: 260px;
+ height: auto;
+}
 
 
+#dt_retympa .top_area .supplement {
+ position: absolute;
+ margin: 100px 0 0 13px;
+ font-size: 70%;
+}
+
+#dt_retympa sup {
+ font-size: 50%;
+}
 
 
 @media screen and (max-width:960px) {
 @media screen and (max-width:960px) {
  /*タブレット表示用CSSを記述*/
  /*タブレット表示用CSSを記述*/

common.min.css

+@charset "UTF-8";html,body,p,h1,h2,h3,h4,h5,h6,ul,ol,dl,dt,dd,li,table,th,td,form{margin:0;padding:0}*{font-size:100%}body{margin:0;padding:0}a img{border:0}a{color:#06f;text-decoration:underline}a:hover{color:#06f}a:visited{color:#551a8b}h1,h2,h3,h4,h5,h6{margin:0 0 .5em 0}p,ul,ol,dl{margin:0 0 1em 0;line-height:1.4}ul,ol{padding:0 0 0 30px}dt{font-weight:bold}dd{margin:0 0 .5em 1.0}table{border-collapse:collapse;border-spacing:0;margin:0 0 1em 0}table th,table td{font-weight:normal;border:1px solid #666;text-align:left;padding:4px 6px;vertical-align:top}table th{background-color:#efefef}table caption{caption-side:top;text-align:left}.clf{min-height:1px}.clf:after{content:"";display:block;clear:both;height:1px;overflow:hidden}/*\*/* html .clf{height:1px;overflow:visible}/**/.doc_separate{display:none}body{font-size:100%;background-color:#fff;text-align:center}#header,#contents,#footer{width:1200px;margin:10px auto;text-align:left}@media screen and (max-width:960px){#header,#contents,#footer{width:100%;margin:0 auto 10px;text-align:left}}#header_inner{padding:10px;border:2px dashed #C00}article{width:100%;margin:0;padding:0}#footer_inner{padding:10px;border:2px dashed #C00}#contents_main{width:850px;margin:0 auto;background:0;border:2px dashed #C00;box-sizing:content-box}#contents_main .dt_area{width:90%;margin:0 5%}.dt_img{width:100%;margin:10px auto;padding:0;text-align:center}.dt_img img{width:100%;height:auto;margin:0 auto;padding:0;text-align:center}.figure{display:block;margin:20px auto;max-width:600px;text-align:right}.figure img{margin:0 auto;padding:0;text-align:center}.figure span{font-size:81.25%;text-align:right}.dt_area table{width:90%;margin:20px 5%}#contents_sub{display:none;float:right;width:300px;background:0;border:2px dashed #C00;box-sizing:content-box}#contents_sub .contents_sub_inner{padding:10px}@media screen and (max-width:960px){#contents_main{clear:both;width:100%;margin:0 auto}#contents_main .dt_area{clear:both;width:100%;margin:0 auto}#contents_sub{clear:both;width:100%;margin:0}.detailing_img img{width:100%;height:auto;max-width:670px;margin:10px auto;padding:0;text-align:center}.figure img{width:90%;height:auto;max-width:670px;margin:10px 5%;padding:0;text-align:center}.dt_area table{width:90%;margin:0 5%}}#dt_retympa .top_area{width:100%;margin:10px 0;border:2px solid #8bc886;display:flex;-webkit-justify-content:space-between;justify-content:space-between}#dt_retympa .top_area .upper_text{position:absolute;margin:3px 0 0 72px;font-weight:600}#dt_retympa .top_area .under_text{position:absolute;margin:68px 0 0 72px;font-weight:600;border-top:1px solid #8bc886}#dt_retympa .top_area .under_text span{font-size:80%;margin-left:25px}#dt_retympa .top_area .retympa_logo{width:400px;height:48px;padding:22px 0 0 15px}#dt_retympa .top_area .retympa_right{width:260px;height:auto}#dt_retympa .top_area .supplement{position:absolute;margin:100px 0 0 13px;font-size:70%}#dt_retympa sup{font-size:50%}
\ No newline at end of file