Skip to content

sora / mci-retympa

Go to a project
Commit 483daadb by o.kimura
Options

レスポンシブ対応、３ページ展開

parent 52088b7c
Inline Side-by-side
Showing with 430 additions and 24 deletions
5.html 0 → 100644
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>ディテーリング入稿用HTML</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript">
google.load('jquery', '1');
google.load('jqueryui', '1');
</script>
<link rel="stylesheet" href="./common.css" type="text/css" />
</head>
<body>
<header id="header">
<div id="header_inner">
</div>
</header>
<div id="contents" class="clf">
<div id="contents_main">
<article>
<!--///////ここから！編集エリア///////-->
<!-- （1）干渉を防ぐために、id="dt_xxx"を必ずユニークなIDに書き換えてください。例。dt_medicaltribune-->
<div id="dt_retympa" class="dt_area">
<div class="top_area">
<img src="/files/logo2.png" alt="" class="retympa_logo">
<img src="/files/main.png" alt="" class="retympa_right">
</div>
<div class="supplement">【禁忌（次の患者には投与しないこと）】<br>
1. 本剤の成分に対し過敏症の既往歴のある患者<br>
2. 耳内に悪性腫瘍のある患者又はその既往歴のある患者［本剤が細胞増殖促進作用を有するため］</div>
<div class="attachedDoc">
注意）禁忌を含む使用上の注意等については、最新の添付文書をご参照ください<br>
<a href="#" target="_blank">＞添付文書はこちら</a>
</div>
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」 小穿孔における投与例</h2>
<div class="drArea">
公益財団法人 田附興風会 医学研究所 北野病院 耳鼻咽喉科・頭頸部外科<br>
公益財団法人神戸医療産業都市推進機構 医療イノベーション推進センター<br>
<strong>金丸 眞一 先生</strong>
</div>
<div class="movieArea">
<p>リティンパは、トラフェルミンと鼓膜用ゼラチンスポンジをセットにした鼓膜穿孔治療剤です。<br>
本剤を用いた治療法では、トラフェルミンの上皮組織増殖作用と血管新生作用により鼓膜修復が期待されます。</p>
<p>細胞増殖の足場となる鼓膜用ゼラチンスポンジは加工が容易であるため、複雑な形状の穿孔や大きな穿孔に対しても効果が認められている、新しい治療法です。</p>
<p>また、本療法は外来で実施可能であり、低侵襲であることも特徴の一つです。<br>
外来で治療が可能な症例や、小穿孔における投与方法、投与後の注意、適正使用情報についてご説明します。
</p>
<div class="figure">
<img src="files/05.png" width="600" height="400" alt="" />
</div>
</div>
<div class="productArea">
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」のご紹介</h2>
<p>「リティンパ<sup>®</sup> 耳科用250μgセット」は、トラフェルミンと鼓膜用ゼラチンスポンジをセットにした鼓膜穿孔治療剤です。本剤を用いた治療法では、トラフェルミンの上皮組織増殖作用と血管新生作用により鼓膜修正が期待されます。複雑な形状の穿孔や大きな穿孔に対しても効果が認められている、新しい治療法です。</p>
<p>「リティンパ.jp」では、<a href="https://retympa.nobelpark.jp/product/features.html#content_3" target="_blank">国内臨床試験成績</a>や、<a href="https://retympa.nobelpark.jp/for_the_first_time/" target="_blank">手術手技解説動画</a>、<a href="https://retympa.nobelpark.jp/member/safety/appropriate_use.html" target="_blank">適正使用に関する情報</a>などを掲載しておりますのでぜひご覧ください。</p>
<div class="btnArea">
<a class="btn_retympa" href="https://retympa.nobelpark.jp/" target="_blank">「リティンパ.jp」へ</a>
</div>
</div>
<div class="meetingArea">
<h2>オンライン面談・説明のご案内</h2>
<p>専任MRがWeb会議システムでリティンパのご紹介や、先生方のご質問にお答えする「オンライン面談・説明会」を行っております。ご希望の日時でご予約いただけますので、ぜひお問い合わせください。</p>
<div class="btnArea">
<a class="btn_retympa" href="#">オンライン面談・説明会に申し込む</a>
</div>
</div>
<!-- // .dt_area -->
</div>
<!--///////ここまで！編集エリア///////-->
</article>
</div>
<div id="contents_sub">
<img src="files/img_banner.png" alt="" />
<div class="contents_sub_inner">
<h2>SideBar / Don't touch</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam mauris erat, sodales quis rutrum eu, tincidunt eu leo. Ut aliquam nulla sit amet libero faucibus tincidunt. Ut et urna purus. Mauris eros nibh, sollicitudin sit amet posuere sed, faucibus id odio. Quisque vitae urna augue. Cras est nisl, iaculis in dignissim nec, facilisis id ipsum. Duis non enim consectetur urna fringilla congue. Nunc nec ipsum orci. Suspendisse vehicula lectus ut sem ornare ut aliquet nibh placerat. Nam eros sem, commodo id auctor egestas, tempor eleifend lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed at felis venenatis nulla pharetra gravida at eu lacus. Vivamus tristique risus non tortor cursus aliquam. Proin quis tortor at nisi vulputate pharetra. Maecenas placerat nisi in nunc ultrices a suscipit diam cursus. Nunc aliquam ultricies dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu ultricies lorem. Nulla luctus adipiscing feugiat.</p>
</div>
</div>
</div>
<hr class="doc_separate" />
<footer id="footer">
<div id="footer_inner">
</div>
</footer>
</body>
</html>
6.html 0 → 100644
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>ディテーリング入稿用HTML</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript">
google.load('jquery', '1');
google.load('jqueryui', '1');
</script>
<link rel="stylesheet" href="./common.css" type="text/css" />
</head>
<body>
<header id="header">
<div id="header_inner">
</div>
</header>
<div id="contents" class="clf">
<div id="contents_main">
<article>
<!--///////ここから！編集エリア///////-->
<!-- （1）干渉を防ぐために、id="dt_xxx"を必ずユニークなIDに書き換えてください。例。dt_medicaltribune-->
<div id="dt_retympa" class="dt_area">
<div class="top_area">
<img src="/files/logo2.png" alt="" class="retympa_logo">
<img src="/files/main.png" alt="" class="retympa_right">
</div>
<div class="supplement">【禁忌（次の患者には投与しないこと）】<br>
1. 本剤の成分に対し過敏症の既往歴のある患者<br>
2. 耳内に悪性腫瘍のある患者又はその既往歴のある患者［本剤が細胞増殖促進作用を有するため］</div>
<div class="attachedDoc">
注意）禁忌を含む使用上の注意等については、最新の添付文書をご参照ください<br>
<a href="#" target="_blank">＞添付文書はこちら</a>
</div>
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」 小穿孔における投与例</h2>
<div class="drArea">
公益財団法人 田附興風会 医学研究所 北野病院 耳鼻咽喉科・頭頸部外科<br>
公益財団法人神戸医療産業都市推進機構 医療イノベーション推進センター<br>
<strong>金丸 眞一 先生</strong>
</div>
<div class="movieArea">
<p>鼓膜再生療法にとって適切な患者選択は、非常に重要です。</p>
<p>鼓膜再生療法の適応患者は、鼓膜・鼓室内が乾燥していること、側頭骨ターゲットCTで鼓室・乳突食腔内に適当な含気があり軟部組織陰影がないこと、鼓室内や鼓膜裏面に上皮の侵入・真珠腫などがないこと、耳小骨連鎖に異常がなく、残存鼓膜も含め正常構造で変形がないことが重要となります。</p>
<p>また、鼓膜再生を困難にする主な要因についての具体例や、その他要注意症例をご説明します。</p>
<div class="figure">
<img src="files/06.png" width="600" height="400" alt="" />
</div>
</div>
<div class="productArea">
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」のご紹介</h2>
<p>「リティンパ<sup>®</sup> 耳科用250μgセット」は、トラフェルミンと鼓膜用ゼラチンスポンジをセットにした鼓膜穿孔治療剤です。本剤を用いた治療法では、トラフェルミンの上皮組織増殖作用と血管新生作用により鼓膜修正が期待されます。複雑な形状の穿孔や大きな穿孔に対しても効果が認められている、新しい治療法です。</p>
<p>「リティンパ.jp」では、<a href="https://retympa.nobelpark.jp/product/features.html#content_3" target="_blank">国内臨床試験成績</a>や、<a href="https://retympa.nobelpark.jp/for_the_first_time/" target="_blank">手術手技解説動画</a>、<a href="https://retympa.nobelpark.jp/member/safety/appropriate_use.html" target="_blank">適正使用に関する情報</a>などを掲載しておりますのでぜひご覧ください。</p>
<div class="btnArea">
<a class="btn_retympa" href="https://retympa.nobelpark.jp/" target="_blank">「リティンパ.jp」へ</a>
</div>
</div>
<div class="meetingArea">
<h2>オンライン面談・説明のご案内</h2>
<p>専任MRがWeb会議システムでリティンパのご紹介や、先生方のご質問にお答えする「オンライン面談・説明会」を行っております。ご希望の日時でご予約いただけますので、ぜひお問い合わせください。</p>
<div class="btnArea">
<a class="btn_retympa" href="#">オンライン面談・説明会に申し込む</a>
</div>
</div>
<!-- // .dt_area -->
</div>
<!--///////ここまで！編集エリア///////-->
</article>
</div>
<div id="contents_sub">
<img src="files/img_banner.png" alt="" />
<div class="contents_sub_inner">
<h2>SideBar / Don't touch</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam mauris erat, sodales quis rutrum eu, tincidunt eu leo. Ut aliquam nulla sit amet libero faucibus tincidunt. Ut et urna purus. Mauris eros nibh, sollicitudin sit amet posuere sed, faucibus id odio. Quisque vitae urna augue. Cras est nisl, iaculis in dignissim nec, facilisis id ipsum. Duis non enim consectetur urna fringilla congue. Nunc nec ipsum orci. Suspendisse vehicula lectus ut sem ornare ut aliquet nibh placerat. Nam eros sem, commodo id auctor egestas, tempor eleifend lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed at felis venenatis nulla pharetra gravida at eu lacus. Vivamus tristique risus non tortor cursus aliquam. Proin quis tortor at nisi vulputate pharetra. Maecenas placerat nisi in nunc ultrices a suscipit diam cursus. Nunc aliquam ultricies dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu ultricies lorem. Nulla luctus adipiscing feugiat.</p>
</div>
</div>
</div>
<hr class="doc_separate" />
<footer id="footer">
<div id="footer_inner">
</div>
</footer>
</body>
</html>
7.html 0 → 100644
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<title>ディテーリング入稿用HTML</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<script type="text/javascript">
google.load('jquery', '1');
google.load('jqueryui', '1');
</script>
<link rel="stylesheet" href="./common.css" type="text/css" />
</head>
<body>
<header id="header">
<div id="header_inner">
</div>
</header>
<div id="contents" class="clf">
<div id="contents_main">
<article>
<!--///////ここから！編集エリア///////-->
<!-- （1）干渉を防ぐために、id="dt_xxx"を必ずユニークなIDに書き換えてください。例。dt_medicaltribune-->
<div id="dt_retympa" class="dt_area">
<div class="top_area">
<img src="/files/logo2.png" alt="" class="retympa_logo">
<img src="/files/main.png" alt="" class="retympa_right">
</div>
<div class="supplement">【禁忌（次の患者には投与しないこと）】<br>
1. 本剤の成分に対し過敏症の既往歴のある患者<br>
2. 耳内に悪性腫瘍のある患者又はその既往歴のある患者［本剤が細胞増殖促進作用を有するため］</div>
<div class="attachedDoc">
注意）禁忌を含む使用上の注意等については、最新の添付文書をご参照ください<br>
<a href="#" target="_blank">＞添付文書はこちら</a>
</div>
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」 小穿孔における投与例</h2>
<div class="drArea">
公益財団法人 田附興風会 医学研究所 北野病院 耳鼻咽喉科・頭頸部外科<br>
公益財団法人神戸医療産業都市推進機構 医療イノベーション推進センター<br>
<strong>金丸 眞一 先生</strong>
</div>
<div class="movieArea">
<p>鼓膜穿孔を有する患者の問題点として、聞こえにくい、難聴・補聴器の効果が不十分、耳が詰まった感じなどの違和感がある、感染しやすい、耳垂れ・悪臭などを引き起こしやすい、入浴・洗髪など日常生活での制限など、数多くあります。</p>
<p>鼓膜穿孔は、単に聴力の低下をもたらすだけではなく、語尾明瞭度を低下させます。補聴器の効果も部分的で、QOLを低下させます。鼓膜穿孔など治療可能な難聴は、積極的治療が望まれる理由についてご説明します。</p>
<div class="figure">
<img src="files/07.png" width="600" height="400" alt="" />
</div>
</div>
<div class="productArea">
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」のご紹介</h2>
<p>「リティンパ<sup>®</sup> 耳科用250μgセット」は、トラフェルミンと鼓膜用ゼラチンスポンジをセットにした鼓膜穿孔治療剤です。本剤を用いた治療法では、トラフェルミンの上皮組織増殖作用と血管新生作用により鼓膜修正が期待されます。複雑な形状の穿孔や大きな穿孔に対しても効果が認められている、新しい治療法です。</p>
<p>「リティンパ.jp」では、<a href="https://retympa.nobelpark.jp/product/features.html#content_3" target="_blank">国内臨床試験成績</a>や、<a href="https://retympa.nobelpark.jp/for_the_first_time/" target="_blank">手術手技解説動画</a>、<a href="https://retympa.nobelpark.jp/member/safety/appropriate_use.html" target="_blank">適正使用に関する情報</a>などを掲載しておりますのでぜひご覧ください。</p>
<div class="btnArea">
<a class="btn_retympa" href="https://retympa.nobelpark.jp/" target="_blank">「リティンパ.jp」へ</a>
</div>
</div>
<div class="meetingArea">
<h2>オンライン面談・説明のご案内</h2>
<p>専任MRがWeb会議システムでリティンパのご紹介や、先生方のご質問にお答えする「オンライン面談・説明会」を行っております。ご希望の日時でご予約いただけますので、ぜひお問い合わせください。</p>
<div class="btnArea">
<a class="btn_retympa" href="#">オンライン面談・説明会に申し込む</a>
</div>
</div>
<!-- // .dt_area -->
</div>
<!--///////ここまで！編集エリア///////-->
</article>
</div>
<div id="contents_sub">
<img src="files/img_banner.png" alt="" />
<div class="contents_sub_inner">
<h2>SideBar / Don't touch</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam mauris erat, sodales quis rutrum eu, tincidunt eu leo. Ut aliquam nulla sit amet libero faucibus tincidunt. Ut et urna purus. Mauris eros nibh, sollicitudin sit amet posuere sed, faucibus id odio. Quisque vitae urna augue. Cras est nisl, iaculis in dignissim nec, facilisis id ipsum. Duis non enim consectetur urna fringilla congue. Nunc nec ipsum orci. Suspendisse vehicula lectus ut sem ornare ut aliquet nibh placerat. Nam eros sem, commodo id auctor egestas, tempor eleifend lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Sed at felis venenatis nulla pharetra gravida at eu lacus. Vivamus tristique risus non tortor cursus aliquam. Proin quis tortor at nisi vulputate pharetra. Maecenas placerat nisi in nunc ultrices a suscipit diam cursus. Nunc aliquam ultricies dolor. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eu ultricies lorem. Nulla luctus adipiscing feugiat.</p>
</div>
</div>
</div>
<hr class="doc_separate" />
<footer id="footer">
<div id="footer_inner">
</div>
</footer>
</body>
</html>
common.css
......@@ -53,7 +53,7 @@ a {
}
a:hover {
color: #0066FF;
color: #074b9c;
}
a:visited {
......@@ -151,13 +151,10 @@ table caption {
#contents,
#footer {
width: 1200px;
margin: 10px auto;
text-align: left;
}
#header_inner {
padding: 10px;
}
#header_inner {}
article {
width: 100%;
......@@ -173,7 +170,6 @@ table caption {
width: 850px;
margin: 0 auto;
background: none;
border: 2px dashed #C00;
box-sizing: content-box;
}
......@@ -252,16 +248,19 @@ table caption {
#dt_retympa .top_area {
width: 100%;
max-width: 100%;
margin: 20px 0 10px 0;
border: 2px solid #8bc886;
display: flex;
flex-basis: auto;
-webkit-justify-content: space-between;
justify-content: space-between;
box-sizing: border-box;
}
#dt_retympa .top_area .retympa_logo {
width: 200px;
height: 37px;
width: 400px;
height: 75px;
padding: 12px 0 0 15px;
}
......@@ -270,9 +269,9 @@ table caption {
height: auto;
}
#dt_retympa .top_area .supplement {
#dt_retympa .supplement {
position: absolute;
margin: 100px 0 0 13px;
margin: -70px 0 0 13px;
font-size: 0.72rem;
}
......@@ -383,6 +382,104 @@ a:hover {
margin: 0 5%;
}
#dt_retympa h2 {
font-size: 1.5rem;
padding: 10px 5px;
}
#dt_retympa .top_area {
width: auto;
margin: 20px 0 10px 0;
border: 2px solid #8bc886;
display: flex;
-webkit-justify-content: space-between;
justify-content: space-between;
}
#dt_retympa .top_area .retympa_logo {
width: 400px;
height: 75px;
padding: 12px 0 0 15px;
}
#dt_retympa .top_area .retympa_right {
width: 260px;
height: auto;
}
#dt_retympa .supplement {
position: absolute;
margin: -70px 0 0 13px;
font-size: 0.69rem;
}
#dt_retympa .attachedDoc {
display: inherit;
text-align: right;
margin-bottom: 10px;
padding: 10px;
}
#dt_retympa .drArea {
display: inherit;
text-align: right;
padding: 10px;
}
#dt_retympa .movieArea {
margin-top: 20px;
padding: 10px;
}
#dt_retympa .productArea {
margin-top: 60px;
padding: 10px;
}
#dt_retympa .meetingArea {
margin: 50px 0;
padding: 10px;
}
#dt_retympa sup {
font-size: 70%;
position: relative;
top: -0.2em;
}
#dt_retympa .btnArea {
display: flex;
justify-content: center;
margin-top: 30px;
}
.btn_retympa {
box-shadow: inset 0px 1px 0px 0px #fce2c1;
background-color: #ff9419;
border-radius: 6px;
display: inline-block;
cursor: pointer;
color: #ffffff !important;
font-size: 1.4rem;
font-weight: bold;
padding: 12px 20px;
text-decoration: none;
text-shadow: 0px 1px 0px #cc9f52;
}
.btn_retympa:hover {
background-color: #ffb561;
}
.btn_retympa:active {
position: relative;
top: 1px;
}
a:hover {
cursor: pointer;
}
}
......@@ -393,13 +490,9 @@ a:hover {
#contents,
#footer {
width: 100%;
margin: 0 auto 10px;
text-align: left;
}
#header_inner {
padding: 10px;
}
#header_inner {}
article {
width: 100%;
......@@ -460,7 +553,8 @@ a:hover {
}
#dt_retympa .top_area {
width: 99%;
width: auto;
height: 168px;
margin: 0;
border: 2px solid #8bc886;
display: inline-block;
......@@ -478,9 +572,9 @@ a:hover {
display: none
}
#dt_retympa .top_area .supplement {
#dt_retympa .supplement {
position: relative;
margin: 0;
margin: -85px 0 0 5px;
font-size: 0.72rem;
padding: 6px;
}
......
common.min.css deleted 100644 → 0
@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}@media screen and (min-width:961px){body{font-size:100%;background-color:#fff;text-align:center}#header,#contents,#footer{width:1200px;margin:10px auto;text-align:left}#header_inner{padding:10px}article{width:100%;margin:0;padding:0}#footer_inner{padding:10px}#contents_main{width:850px;margin:0 auto;background:0;border:2px dashed #C00;box-sizing:content-box}#contents_main .dt_area{margin:0 20px}.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}}#dt_retympa h2{font-size:1.5rem}#dt_retympa .top_area{width:100%;margin:20px 0 10px 0;border:2px solid #8bc886;display:flex;-webkit-justify-content:space-between;justify-content:space-between}#dt_retympa .top_area .retympa_logo{width:200px;height:37px;padding:12px 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:.72rem}#dt_retympa .attachedDoc{display:inherit;text-align:right;margin-bottom:10px}#dt_retympa .drArea{display:inherit;text-align:right}#dt_retympa .movieArea{margin-top:30px}#dt_retympa .productArea{margin-top:70px}#dt_retympa .meetingArea{margin:60px 0}#dt_retympa sup{font-size:70%;position:relative;top:-0.2em}#dt_retympa .btnArea{display:flex;justify-content:center;margin-top:30px}.btn_retympa{box-shadow:inset 0 1px 0 0 #fce2c1;background-color:#ff9419;border-radius:6px;display:inline-block;cursor:pointer;color:#fff!important;font-size:1.4rem;font-weight:bold;padding:12px 20px;text-decoration:none;text-shadow:0 1px 0 #cc9f52}.btn_retympa:hover{background-color:#ffb561}.btn_retympa:active{position:relative;top:1px}a:hover{cursor:pointer}@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{display:none;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%}}@media screen and (max-width:480px){#header,#contents,#footer{width:100%;margin:0 auto 10px;text-align:left}#header_inner{padding:10px}article{width:100%;margin:0;padding:0}#footer_inner{padding:10px}#contents_main{clear:both;width:100%;margin:0 auto}#contents_main .dt_area{clear:both;width:100%;margin:0 auto}#contents_sub{display:none;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 h2{font-size:1rem;padding:10px 5px;margin-bottom:0}#dt_retympa .top_area{width:99%;margin:0;border:2px solid #8bc886;display:inline-block;-webkit-justify-content:space-between;justify-content:space-between}#dt_retympa .top_area .retympa_logo{width:93%;height:auto;padding:10px}#dt_retympa .top_area .retympa_right{display:none}#dt_retympa .top_area .supplement{position:relative;margin:0;font-size:.72rem;padding:6px}#dt_retympa .attachedDoc{display:inherit;text-align:right;margin-bottom:0;font-size:.8rem;padding:10px}#dt_retympa .drArea{font-size:.8rem;padding:10px}#dt_retympa .movieArea{margin-top:0;font-size:.8rem;padding:10px}#dt_retympa .productArea{margin-top:0;font-size:.8rem;padding:10px}#dt_retympa .meetingArea{margin:0;font-size:.8rem;padding:10px}#dt_retympa sup{font-size:70%;position:relative;top:-0.2em}#dt_retympa .btnArea{display:flex;justify-content:center;margin-top:30px}.btn_retympa{font-size:1rem}.btn_retympa:hover{background-color:#ffb561}.btn_retympa:active{position:relative;top:1px}a:hover{cursor:pointer}}
\ No newline at end of file
index.html
......@@ -34,14 +34,14 @@
<div class="top_area">
<img src="/files/logo2.png" alt="" class="retympa_logo">
<img src="/files/main.png" alt="" class="retympa_right">
<div class="supplement">【禁忌（次の患者には投与しないこと）】<br>
1. 本剤の成分に対し過敏症の既往歴のある患者<br>
2. 耳内に悪性腫瘍のある患者又はその既往歴のある患者［本剤が細胞増殖促進作用を有するため］</div>
</div>
<div class="supplement">【禁忌（次の患者には投与しないこと）】<br>
1. 本剤の成分に対し過敏症の既往歴のある患者<br>
2. 耳内に悪性腫瘍のある患者又はその既往歴のある患者［本剤が細胞増殖促進作用を有するため］</div>
<div class="attachedDoc">
注意）禁忌を含む使用上の注意等については、最新の添付文書をご参照ください<br>
<a href="">＞添付文書はこちら</a>
<a href="#" target="_blank">＞添付文書はこちら</a>
</div>
<h2>「リティンパ<sup>®</sup> 耳科用250μgセット」 小穿孔における投与例</h2>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment